SYNC: diagram style

packages/web/src/designer/ColumnLine.svelte

@@ -195,12 +195,12 @@
   {#if designer?.style?.showNullability || designer?.style?.showDataType}
     <div class="space" />
     {#if designer?.style?.showDataType && column?.dataType}
-      <div class="ml-2">
+      <div class="ml-2 data-type">
         {(column?.displayedDataType || column?.dataType).toLowerCase()}
       </div>
     {/if}
     {#if designer?.style?.showNullability}
-      <div class="ml-2">
+      <div class="ml-2 nullability">
         {column?.notNull ? 'NOT NULL' : 'NULL'}
       </div>
     {/if}
@@ -238,4 +238,12 @@
     background: var(--theme-bg-2);
     color: var(--theme-font-hover);
   }
+
+  .nullability {
+    color: var(--theme-font-4);
+  }
+
+  .data-type {
+    color: var(--theme-font-4);
+  }
 </style>

packages/web/src/designer/DiagramSettings.svelte

@@ -14,6 +14,7 @@
     defaultValue=""
     name="filterColumns"
     label="Show columns"
+    data-testid="DiagramSettings_filterColumns"
     isNative
     options={[
       {
@@ -36,33 +37,13 @@
         value: 'keysAndNotNull',
         label: 'Keys And Not Null',
       },
-
-      //   {
-      //           text: 'All',
-      //           onClick: changeStyleFunc('filterColumns', ''),
-      //         },
-      //         {
-      //           text: 'Primary Key',
-      //           onClick: changeStyleFunc('filterColumns', 'primaryKey'),
-      //         },
-      //         {
-      //           text: 'All Keys',
-      //           onClick: changeStyleFunc('filterColumns', 'allKeys'),
-      //         },
-      //         {
-      //           text: 'Not Null',
-      //           onClick: changeStyleFunc('filterColumns', 'notNull'),
-      //         },
-      //         {
-      //           text: 'Keys And Not Null',
-      //           onClick: changeStyleFunc('filterColumns', 'keysAndNotNull'),
-      //         },
     ]}
   />
 
   <FormSelectField
     defaultValue="1"
     name="zoomKoef"
+    data-testid="DiagramSettings_zoomKoef"
     label="Zoom"
     isNative
     options={[
@@ -117,6 +98,6 @@
     ]}
   />
 
-  <FormCheckboxField name="showNullability" label="Show NULL/NOT NULL" />
+  <FormCheckboxField name="showNullability" label="Show NULL/NOT NULL" data-testid="DiagramSettings_showNullability" />
-  <FormCheckboxField name="showDataType" label="Show data type" />
+  <FormCheckboxField name="showDataType" label="Show data type" data-testid="DiagramSettings_showDataType" />
 </FormProviderCore>