Merge pull request #165 from crupest/timeline

Redesign timeline ui.

1 files changed, 20 insertions, 19 deletions

diff --git a/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx b/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx
index d9467719..786ebb5d 100644
--- a/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx
+++ b/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx
@@ -20,27 +20,28 @@ const TimelineCreateDialog: React.FC<TimelineCreateDialogProps> = (props) => {
       close={props.close}
       titleColor="success"
       title="home.createDialog.title"
-      inputScheme={[
-        {
-          type: "text",
-          label: "home.createDialog.name",
-          helperText: "home.createDialog.nameFormat",
-          validator: (name) => {
-            if (name.length === 0) {
-              return "home.createDialog.noEmpty";
-            } else if (name.length > 26) {
-              return "home.createDialog.tooLong";
-            } else if (!validateTimelineName(name)) {
-              return "home.createDialog.badFormat";
-            } else {
-              return null;
-            }
+      inputScheme={
+        [
+          {
+            type: "text",
+            label: "home.createDialog.name",
+            helperText: "home.createDialog.nameFormat",
           },
-        },
-      ]}
+        ] as const
+      }
+      inputValidator={([name]) => {
+        if (name.length === 0) {
+          return { 0: "home.createDialog.noEmpty" };
+        } else if (name.length > 26) {
+          return { 0: "home.createDialog.tooLong" };
+        } else if (!validateTimelineName(name)) {
+          return { 0: "home.createDialog.badFormat" };
+        } else {
+          return null;
+        }
+      }}
       onProcess={([name]) => {
-        nameSaved = name as string;
-        return timelineService.createTimeline(nameSaved).toPromise();
+        return timelineService.createTimeline(name).toPromise();
       }}
       onSuccessAndClose={() => {
         history.push(`timelines/${nameSaved}`);