From 2da732632bdb996ba106a395bcc4c1fdb6938e2c Mon Sep 17 00:00:00 2001
From: Kuvam Bhardwaj <kuvam@oaktreeapps.com>
Date: Fri, 14 Jul 2023 23:45:48 +0530
Subject: [PATCH 1/3] - add multi-select field component

---
 .../FormFields/FormInputMultiSelect.tsx       | 36 +++++++++++++++++++
 webapp/src/screens/XXXXX/CreateXXXXX.tsx      | 10 +++++-
 webapp/src/screens/XXXXX/EditXXXXX.tsx        |  1 +
 3 files changed, 46 insertions(+), 1 deletion(-)
 create mode 100644 webapp/src/components/FormFields/FormInputMultiSelect.tsx

diff --git a/webapp/src/components/FormFields/FormInputMultiSelect.tsx b/webapp/src/components/FormFields/FormInputMultiSelect.tsx
new file mode 100644
index 0000000..38571c8
--- /dev/null
+++ b/webapp/src/components/FormFields/FormInputMultiSelect.tsx
@@ -0,0 +1,36 @@
+import { MultiSelect } from "primereact/multiselect";
+import { classNames } from "primereact/utils";
+import FormField from "./FormField";
+import FormFieldProps from "./FormFieldProps";
+
+interface Props extends FormFieldProps {
+  options: { name: string; value: string }[];
+}
+
+export default function FormInputMultiSelect({
+  fieldName,
+  inline,
+  control,
+  rules,
+  options,
+}: Props) {
+  return (
+    <FormField
+      fieldName={fieldName}
+      control={control}
+      rules={rules}
+      inline={!!inline}
+      render={({ field, fieldState }) => (
+        <MultiSelect
+          value={field.value}
+          onChange={(e) => field.onChange(e.value)}
+          options={options}
+          optionLabel="name"
+          optionValue="value"
+          maxSelectedLabels={3}
+          className={classNames({ "p-invalid": fieldState.error }, "w-full")}
+        />
+      )}
+    />
+  );
+}
diff --git a/webapp/src/screens/XXXXX/CreateXXXXX.tsx b/webapp/src/screens/XXXXX/CreateXXXXX.tsx
index 5f4180f..bdf3a7e 100644
--- a/webapp/src/screens/XXXXX/CreateXXXXX.tsx
+++ b/webapp/src/screens/XXXXX/CreateXXXXX.tsx
@@ -23,6 +23,7 @@ import FormInputSwitch from "@/components/FormFields/FormInputSwitch";
 import FormInputRadio from "@/components/FormFields/FormInputRadio";
 import FormInputUpload from "@/components/FormFields/FormInputUpload";
 import FormInputPassword from "@/components/FormFields/FormInputPassword";
+import FormInputMultiSelect from "@/components/FormFields/FormInputMultiSelect";
 
 function CreateXXXXX() {
   const initialState: XXXXXType = {
@@ -54,7 +55,14 @@ function CreateXXXXX() {
   const saveEntity = async (data: XXXXXType) => {
     await mutateEntity(data);
   };
-
+  const [selectedCities, setSelectedCities] = useState(null);
+  const cities = [
+    { name: "New York", value: "NY" },
+    { name: "Rome", value: "RM" },
+    { name: "London", value: "LDN" },
+    { name: "Istanbul", value: "IST" },
+    { name: "Paris", value: "PRS" },
+  ];
   return (
     <>
       <Toast ref={toast} />
diff --git a/webapp/src/screens/XXXXX/EditXXXXX.tsx b/webapp/src/screens/XXXXX/EditXXXXX.tsx
index fb2f3c9..baba2a1 100644
--- a/webapp/src/screens/XXXXX/EditXXXXX.tsx
+++ b/webapp/src/screens/XXXXX/EditXXXXX.tsx
@@ -22,6 +22,7 @@ import FormInputSwitch from "@/components/FormFields/FormInputSwitch";
 import FormInputRadio from "@/components/FormFields/FormInputRadio";
 import FormInputUpload from "@/components/FormFields/FormInputUpload";
 import FormInputPassword from "@/components/FormFields/FormInputPassword";
+import FormInputMultiSelect from "@/components/FormFields/FormInputMultiSelect";
 import { useForm } from "react-hook-form";
 
 function EditXXXXX() {

From 3565e4297eccf75c03acf118ebb4a02884148f4f Mon Sep 17 00:00:00 2001
From: Kuvam Bhardwaj <kuvam@oaktreeapps.com>
Date: Tue, 18 Jul 2023 18:43:19 +0530
Subject: [PATCH 2/3] - add type support for MultiSelect crud field - add type
 support for "only" field

---
 kitconfig/types.d.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/kitconfig/types.d.ts b/kitconfig/types.d.ts
index 572c91b..4114ae4 100644
--- a/kitconfig/types.d.ts
+++ b/kitconfig/types.d.ts
@@ -20,7 +20,8 @@ export type CrudField = {
     | "Password"
     | "ColorPicker"
     | "Editor"
-    | "ImageFileUpload";
+    | "ImageFileUpload"
+    | "MultiSelect";
 };
 
 export type Resource = {
@@ -28,4 +29,5 @@ export type Resource = {
   url: string;
   collectionName: string;
   crudFields: CrudField[];
+  only?: "server" | "webapp";
 };

From be636cd090c3658f8e9c671698002270fbc86e82 Mon Sep 17 00:00:00 2001
From: Kuvam Bhardwaj <kuvam@oaktreeapps.com>
Date: Wed, 2 Aug 2023 19:03:23 +0530
Subject: [PATCH 3/3] - change students resource config file

---
 kitconfig/resources/students.cjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/kitconfig/resources/students.cjs b/kitconfig/resources/students.cjs
index 3ea37a2..280a802 100644
--- a/kitconfig/resources/students.cjs
+++ b/kitconfig/resources/students.cjs
@@ -40,4 +40,4 @@ const resource = {
   ],
 };
 
-module.exports = resource;
+resource;