diff --git a/i18n/en.pot b/i18n/en.pot
index 24b0493..240e328 100644
--- a/i18n/en.pot
+++ b/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2024-12-13T09:39:44.127Z\n"
-"PO-Revision-Date: 2024-12-13T09:39:44.128Z\n"
+"POT-Creation-Date: 2024-12-16T12:36:28.842Z\n"
+"PO-Revision-Date: 2024-12-16T12:36:28.843Z\n"
 
 msgid "DataStore"
 msgstr "DataStore"
@@ -17,6 +17,12 @@ msgstr "UserDataStore"
 msgid "Search"
 msgstr "Search"
 
+msgid "Key deleted successfully"
+msgstr "Key deleted successfully"
+
+msgid "There was an error deleting the key"
+msgstr "There was an error deleting the key"
+
 msgid "Actions"
 msgstr "Actions"
 
@@ -41,12 +47,6 @@ msgstr "Add New Key"
 msgid "Add New Namespace"
 msgstr "Add New Namespace"
 
-msgid "Namespace"
-msgstr "Namespace"
-
-msgid "Key"
-msgstr "Key"
-
 msgid "Cancel"
 msgstr "Cancel"
 
@@ -56,6 +56,21 @@ msgstr "Add Key"
 msgid "Add Namespace"
 msgstr "Add Namespace"
 
+msgid "Namespace"
+msgstr "Namespace"
+
+msgid "Key"
+msgstr "Key"
+
+msgid "Delete Key"
+msgstr "Delete Key"
+
+msgid "Delete Namespace"
+msgstr "Delete Namespace"
+
+msgid "This will delete all the keys in this namespace"
+msgstr "This will delete all the keys in this namespace"
+
 msgid "Invalid JSON value"
 msgstr "Invalid JSON value"
 
@@ -71,6 +86,12 @@ msgstr "Loading"
 msgid "Error getting this information"
 msgstr "Error getting this information"
 
+msgid "An error has occurred"
+msgstr "An error has occurred"
+
+msgid "Back to datastore"
+msgstr "Back to datastore"
+
 msgid "Search namespaces"
 msgstr "Search namespaces"
 
@@ -80,12 +101,6 @@ msgstr "Search keys in this namespace"
 msgid "Key Name"
 msgstr "Key Name"
 
-msgid "An error has occurred"
-msgstr "An error has occurred"
-
-msgid "Back to datastore"
-msgstr "Back to datastore"
-
 msgid "Key updated successfully"
 msgstr "Key updated successfully"
 
diff --git a/src/components/actions/CreateModal.tsx b/src/components/actions/CreateModal.tsx
index 2c23c46..4b52960 100644
--- a/src/components/actions/CreateModal.tsx
+++ b/src/components/actions/CreateModal.tsx
@@ -5,11 +5,17 @@ import {
     ModalActions,
     Button,
     ButtonStrip,
-    InputField,
+    ReactFinalForm,
+    InputFieldFF,
+    hasValue,
+    composeValidators,
+    alphaNumeric,
 } from '@dhis2/ui'
 import React from 'react'
 import i18n from '../../locales'
 
+const { Form, Field } = ReactFinalForm
+
 type FieldValues = {
     key?: string
     namespace?: string
@@ -33,51 +39,62 @@ const CreateModal = ({
     const addNewKey = type === 'key'
     const addNewNamespace = type === 'namespace'
 
+    const onSubmit = (values) => {
+        console.log(values)
+    }
+
     return (
         <Modal>
-            <ModalTitle>
-                {addNewKey && i18n.t('Add New Key')}
-                {addNewNamespace && i18n.t('Add New Namespace')}
-            </ModalTitle>
-            <ModalContent>
-                {addNewNamespace && (
-                    <InputField
-                        label={i18n.t('Namespace')}
-                        required
-                        initialFocus
-                        value={values?.namespace}
-                        onChange={({ value }) => {
-                            setValues({
-                                ...values,
-                                ['namespace']: value,
-                            })
-                        }}
-                    />
+            <Form onSubmit={onSubmit}>
+                {({ handleSubmit }) => (
+                    <form onSubmit={handleSubmit}>
+                        <ModalTitle>
+                            {addNewKey && i18n.t('Add New Key')}
+                            {addNewNamespace && i18n.t('Add New Namespace')}
+                        </ModalTitle>
+                        <ModalContent>
+                            {addNewNamespace && (
+                                <Field
+                                    name="namespace"
+                                    component={InputFieldFF}
+                                    required
+                                    label="Namespace"
+                                    validate={composeValidators(
+                                        hasValue,
+                                        alphaNumeric
+                                    )}
+                                    initialFocus={addNewNamespace}
+                                />
+                            )}
+                            <Field
+                                name="key"
+                                component={InputFieldFF}
+                                required
+                                label="key"
+                                validate={composeValidators(
+                                    hasValue,
+                                    alphaNumeric
+                                )}
+                                initialFocus={addNewKey}
+                            />
+                        </ModalContent>
+                        <ModalActions>
+                            <ButtonStrip end>
+                                <Button secondary onClick={closeModal}>
+                                    {i18n.t('Cancel')}
+                                </Button>
+                                <Button
+                                    primary
+                                    onClick={() => createFn(values)}
+                                >
+                                    {addNewKey && i18n.t('Add Key')}
+                                    {addNewNamespace && i18n.t('Add Namespace')}
+                                </Button>
+                            </ButtonStrip>
+                        </ModalActions>
+                    </form>
                 )}
-                <InputField
-                    label={i18n.t('Key')}
-                    required
-                    initialFocus={addNewKey}
-                    value={values?.key}
-                    onChange={({ value }) => {
-                        setValues({
-                            ...values,
-                            ['key']: value,
-                        })
-                    }}
-                />
-            </ModalContent>
-            <ModalActions>
-                <ButtonStrip end>
-                    <Button secondary onClick={closeModal}>
-                        {i18n.t('Cancel')}
-                    </Button>
-                    <Button primary onClick={() => createFn(values)}>
-                        {addNewKey && i18n.t('Add Key')}
-                        {addNewNamespace && i18n.t('Add Namespace')}
-                    </Button>
-                </ButtonStrip>
-            </ModalActions>
+            </Form>
         </Modal>
     )
 }