fix: use checkbox instead of icons

Signed-off-by: mertmit <mertmit99@gmail.com>

packages/nc-gui/components/dashboard/settings/DataSources.vue

@@ -256,16 +256,10 @@ watch(
                         <template v-if="sources[0].enabled">Hide in UI</template>
                         <template v-else>Show in UI</template>
                       </template>
-                      <MdiEyeSettings
+                      <a-checkbox
-                        v-if="sources[0].enabled"
+                        :checked="sources[0].enabled ? true : false"
-                        class="text-lg text-primary outline-0"
+                        @change="toggleBase(sources[0], $event.target?.checked)"
-                        @click="toggleBase(sources[0], false)"
+                      ></a-checkbox>
-                      ></MdiEyeSettings>
-                      <MdiEyeSettingsOutline
-                        v-else
-                        class="text-lg text-red-500 outline-0"
-                        @click="toggleBase(sources[0], true)"
-                      ></MdiEyeSettingsOutline>
                     </a-tooltip>
                   </div>
                 </div>
@@ -337,16 +331,10 @@ watch(
                         <template v-if="base.enabled">Hide in UI</template>
                         <template v-else>Show in UI</template>
                       </template>
-                      <MdiEyeSettings
+                      <a-checkbox
-                        v-if="base.enabled"
+                        :checked="base.enabled ? true : false"
-                        class="text-lg text-primary outline-0"
+                        @change="toggleBase(base, $event.target?.checked)"
-                        @click="toggleBase(base, false)"
+                      ></a-checkbox>
-                      ></MdiEyeSettings>
-                      <MdiEyeSettingsOutline
-                        v-else
-                        class="text-lg text-red-500 outline-0"
-                        @click="toggleBase(base, true)"
-                      ></MdiEyeSettingsOutline>
                     </a-tooltip>
                   </div>
                 </div>