Merge pull request #189 from kbss-cvut/fetch-type-ahead

Add simulation of possible values endpoint

.storybook/preview.js

@@ -50,6 +50,12 @@ export const globalTypes = {
     defaultValue: false,
     control: { type: "boolean" },
   },
+  timeOut: {
+    name: "Time Out (ms)",
+    description: "Set time-out for possible values (in ms)",
+    defaultValue: 1500,
+    control: { type: "number", min: 0, max: 10000, step: 500 },
+  },
 };
 
 const options = {

src/stories/SForms.stories.tsx

@@ -12,6 +12,7 @@ import occurrenceReportingForm from "./assets/form/occurrenceReportingForm.json"
 import queryString from "query-string";
 import Constants from "../constants/Constants";
 import IntlContextProvider from "../contexts/IntlContextProvider";
+import possibleValues from "./assets/possibleValues.json";
 
 const getP = (queryParameterName: string, defaultValue: string) => {
   return {
@@ -39,7 +40,7 @@ export default {
 
 const Template: ComponentStory<typeof SForms> = (
   args,
-  { globals: { iconBehavior, locale, debugMode, horizontalNavBar } }
+  { globals: { iconBehavior, locale, debugMode, horizontalNavBar, timeOut } }
 ) => {
   const options = {
     i18n: {
@@ -82,9 +83,20 @@ const Template: ComponentStory<typeof SForms> = (
       },
     ],
   };
+
+  const fetchTypeAheadValues = () => {
+    return new Promise((resolve) =>
+      setTimeout(() => resolve(possibleValues), timeOut)
+    );
+  };
+
   return (
     <IntlContextProvider locale={locale}>
-      <SForms {...args} options={options} />
+      <SForms
+        {...args}
+        options={options}
+        fetchTypeAheadValues={fetchTypeAheadValues}
+      />
     </IntlContextProvider>
   );
 };