diff --git a/src/routes/console/[project]/databases/database/[database]/collection/[collection]/_create.svelte b/src/routes/console/[project]/databases/database/[database]/collection/[collection]/_create.svelte
index d2d4bb56d..117c87909 100644
--- a/src/routes/console/[project]/databases/database/[database]/collection/[collection]/_create.svelte
+++ b/src/routes/console/[project]/databases/database/[database]/collection/[collection]/_create.svelte
@@ -8,10 +8,15 @@
         InputText,
         InputEmail,
         InputNumber,
+        InputSelect,
         Button
     } from '$lib/elements/forms';
-    import { collection } from './store';
+    import { attributeList, type Attributes } from './store';
     import { sdkForProject } from '$lib/stores/sdk';
+    import { page } from '$app/stores';
+    import { onMount } from 'svelte';
+
+    $: attributeList.load($page.params.collection);
 
     export let showCreate = false;
 
@@ -19,37 +24,80 @@
         { title: 'Create data', current: true, completed: false },
         { title: 'Set permissions', current: false, completed: false }
     ];
-
     let currentStep = 0;
-
-    const comp = (type: string) => {
-        switch (type) {
-            case 'boolean':
-                return InputCheckbox;
-            case 'email':
-                return InputEmail;
-            case 'float':
-                return InputNumber;
-            case 'integer':
-                return InputNumber;
-
-            default:
-                return InputText;
-        }
-    };
-
     let newDocument = {};
     let read: string[];
     let write: string[];
 
+    onMount(async () => {
+        console.log($attributeList);
+        await attributeList.load($page.params.collection);
+        $attributeList.attributes.forEach((attr) => {
+            newDocument[attr.key] = attr.default;
+        });
+    });
+
     const create = async () => {
-        await sdkForProject.databases.createDocument(
-            $collection.$id,
-            'unique()',
-            newDocument,
-            read,
-            write
-        );
+        console.log(newDocument);
+        // await sdkForProject.databases.createDocument(
+        //    $page.params.collection,
+        //     'unique()',
+        //     newDocument,
+        //     read,
+        //     write
+        // );
+    };
+
+    const comp = (attr: Attributes) => {
+        if (attr.array) {
+            if (attr.type === 'string')
+                switch (attr?.format) {
+                    case 'email':
+                        return InputEmail;
+                    case 'enum':
+                        return InputSelect;
+
+                    default:
+                        return InputText;
+                }
+            else {
+                switch (attr?.type) {
+                    case 'boolean':
+                        return InputSelect;
+                    case 'double':
+                        return InputNumber;
+                    case 'integer':
+                        return InputNumber;
+
+                    default:
+                        return InputText;
+                }
+            }
+        } else {
+            if (attr.type === 'string')
+                switch (attr?.format) {
+                    case 'email':
+                        return InputEmail;
+                    case 'enum':
+                        return InputSelect;
+
+                    default:
+                        return InputText;
+                }
+            else {
+                switch (attr?.type) {
+                    case 'boolean':
+                        return InputCheckbox;
+                    case 'double':
+                        return InputNumber;
+                    case 'integer':
+                        return InputNumber;
+
+                    default:
+                        return InputText;
+                }
+            }
+        }
     };
 
     const nextStep = () => {
@@ -60,7 +108,6 @@
     };
     const prevStep = () => {
         steps[currentStep].current = false;
-
         currentStep--;
         steps[currentStep].current = true;
         steps[currentStep].completed = false;
@@ -82,36 +129,54 @@
             <h1 class="heading-level-6">Create document data</h1>
             <p>Provide document data based on attributes you created earlier.</p>
         </header>
-        <div class="form-content">
-            <FormList>
-                {#each $collection.attributes as attribute}
-                    {#if attribute.array}
-                        <li class="form-item is-multiple">
-                            <div class="form-item-part u-stretch">
-                                <svelte:component
-                                    this={comp(attribute.type)}
-                                    label={attribute.key}
-                                    id={attribute.key}
-                                    required={attribute.required}
-                                    bind:value={newDocument[attribute.key]} />
-                            </div>
-                            <div class="form-item-part u-cross-child-end">
-                                <Button text>
-                                    <span class="icon-x" aria-hidden="true" />
-                                </Button>
-                            </div>
-                        </li>
-                    {:else}
-                        <svelte:component
-                            this={comp(attribute.type)}
-                            label={attribute.key}
-                            id={attribute.key}
-                            required={attribute.required}
-                            bind:value={newDocument[attribute.key]} />
-                    {/if}
-                {/each}
-            </FormList>
-        </div>
+        {#if $attributeList?.total}
+            <div class="form-content">
+                <FormList>
+                    {#each $attributeList.attributes as attribute}
+                        {#if attribute?.array}
+                            <li class="form-item is-multiple">
+                                <div class="form-item-part u-stretch">
+                                    <svelte:component
+                                        this={comp(attribute)}
+                                        label={attribute.key}
+                                        id={attribute.key}
+                                        required={attribute.required}
+                                        placeholder={attribute.key}
+                                        options={attribute.type === 'boolean'
+                                            ? [
+                                                  { value: true, label: 'True' },
+                                                  { value: false, label: 'False' }
+                                              ]
+                                            : attribute?.elements?.map((n) => {
+                                                  return { value: n, label: n };
+                                              })}
+                                        bind:value={newDocument[attribute.key]} />
+                                </div>
+                                <div class="form-item-part u-cross-child-end">
+                                    <Button text>
+                                        <span class="icon-x" aria-hidden="true" />
+                                    </Button>
+                                </div>
+                            </li>
+                        {:else}
+                            <svelte:component
+                                this={comp(attribute)}
+                                label={attribute.key}
+                                id={attribute.key}
+                                required={attribute.required}
+                                placeholder={attribute.key}
+                                minlength={attribute?.min}
+                                maxlength={attribute?.max}
+                                step={attribute.type === 'double' ? 0.1 : 1}
+                                bind:value={newDocument[attribute.key]}
+                                options={attribute?.elements?.map((n) => {
+                                    return { value: n, label: n };
+                                })} />
+                        {/if}
+                    {/each}
+                </FormList>
+            </div>
+        {/if}
 
         <div class="form-footer">
             <div class="u-flex u-main-end u-gap-12">
diff --git a/src/routes/console/[project]/databases/database/[database]/collection/[collection]/store.ts b/src/routes/console/[project]/databases/database/[database]/collection/[collection]/store.ts
index b41da1f46..aa6ef6ca8 100644
--- a/src/routes/console/[project]/databases/database/[database]/collection/[collection]/store.ts
+++ b/src/routes/console/[project]/databases/database/[database]/collection/[collection]/store.ts
@@ -83,13 +83,30 @@ function createIndexListStore() {
         }
     };
 }
+function createAttributeListStore() {
+    const { subscribe, set } = writable<Models.AttributeList>(
+        browser ? JSON.parse(sessionStorage.getItem('attributeList')) : null
+    );
+    return {
+        subscribe,
+        set,
+        load: async (collectionId: string) => {
+            const response = await sdkForProject.databases.listAttributes(collectionId);
+            set(response);
+        }
+    };
+}
 
 export const collection = createCollection();
 export const documentList = createDocumentListStore();
 export const indexList = createIndexListStore();
+export const attributeList = createAttributeListStore();
 
 if (browser) {
     collection.subscribe((n) => sessionStorage?.setItem('collection', JSON.stringify(n ?? '')));
     documentList.subscribe((n) => sessionStorage?.setItem('documentList', JSON.stringify(n ?? '')));
     indexList.subscribe((n) => sessionStorage?.setItem('indexList', JSON.stringify(n ?? '')));
+    attributeList.subscribe((n) =>
+        sessionStorage?.setItem('attributeList', JSON.stringify(n ?? ''))
+    );
 }