Flag for index lengths

Author: abnegate

.env.example

@@ -1,5 +1,5 @@
 PUBLIC_CONSOLE_MODE=self-hosted
-PUBLIC_CONSOLE_FEATURE_FLAGS=sites,csv-import,attribute-encrypt
+PUBLIC_CONSOLE_FEATURE_FLAGS=sites,csv-import,attribute-encrypt,index-lengths
 PUBLIC_APPWRITE_MULTI_REGION=false
 PUBLIC_APPWRITE_ENDPOINT=http://localhost/v1
 PUBLIC_STRIPE_KEY=

src/lib/flags.ts

@@ -21,5 +21,6 @@ function isFlagEnabled(name: string) {
 export const flags = {
     showSites: isFlagEnabled('sites'),
     showCsvImport: isFlagEnabled('csv-import'),
-    showAttributeEncrypt: isFlagEnabled('attribute-encrypt')
+    showAttributeEncrypt: isFlagEnabled('attribute-encrypt'),
+    showIndexLengths: isFlagEnabled('index-lengths')
 };

src/routes/(console)/project-[region]-[project]/databases/database-[database]/collection-[collection]/indexes/createIndex.svelte

@@ -14,6 +14,7 @@
     import { type Attributes, collection, indexes } from '../store';
     import { Icon, Layout } from '@appwrite.io/pink-svelte';
     import { IconPlus } from '@appwrite.io/pink-icons-svelte';
+    import { flags } from '$lib/flags';
 
     export let showCreateIndex = false;
     export let externalAttribute: Attributes = null;
@@ -38,6 +39,8 @@
 
     let attributeList = [{ value: '', order: '', length: null }];
 
+    let showLengths = flags.showIndexLengths(page.data);
+
     function generateIndexKey() {
         let indexKeys = $indexes.map((index) => index.key);
 
@@ -149,7 +152,7 @@
                     placeholder="Select Order" />
 
                 <Layout.Stack direction="row" alignItems="flex-end" gap="xs">
-                    {#if selectedType === IndexType.Key}
+                    {#if selectedType === IndexType.Key && showLengths}
                         <InputNumber
                             id={`length-${i}`}
                             label={i === 0 ? 'Length' : undefined}

src/routes/(console)/project-[region]-[project]/databases/database-[database]/collection-[collection]/indexes/overviewIndex.svelte

@@ -3,9 +3,13 @@
     import { InputText } from '$lib/elements/forms';
     import { Layout } from '@appwrite.io/pink-svelte';
     import type { Models } from '@appwrite.io/console';
+    import { page } from '$app/state';
+    import { flags } from '$lib/flags';
 
     export let showOverview = false;
     export let selectedIndex: Models.Index = null;
+
+    let showLengths = flags.showIndexLengths(page.data);
 </script>
 
 <Modal title="Overview" bind:show={showOverview}>
@@ -39,12 +43,14 @@
                     id={`value-${selectedIndex.orders[i]}`}
                     value={selectedIndex.orders[i]}
                     readonly />
-                <InputText
-                    required
-                    label={i === 0 ? 'Length' : ''}
-                    id={`value-${selectedIndex.lengths[i]}`}
-                    value={selectedIndex.lengths[i]?.toString() ?? null}
-                    readonly />
+                {#if showLengths}
+                    <InputText
+                        required
+                        label={i === 0 ? 'Length' : ''}
+                        id={`value-${selectedIndex.lengths[i]}`}
+                        value={selectedIndex.lengths[i]?.toString() ?? null}
+                        readonly />
+                {/if}
             </Layout.Stack>
         {/each}
     {/if}