format body to create sub object if needed

components/editor/main/hooks/useRequest.ts

@@ -28,8 +28,24 @@ export const useRequest = (method: "post" | "put" | "patch" | "delete" | "get",
 
     const needBody = ["post", "put", "patch"].includes(method);
 
-    axios[method](url.pathname, needBody ? body : {
-      data: method === "delete" ? body : undefined,
+    const formattedBody = Object.entries(body as any).reduce((acc: any, [key, value]) => {
+      if (key.includes(".")) {
+        const [first, ...rest] = key.split(".");
+        acc[first] = {
+          ...acc[first],
+          [rest.join(".")]: value
+        }
+      } else {
+        acc[key] = value;
+      }
+      return acc;
+    }
+    , {});
+
+    console.log(formattedBody);
+
+    axios[method](url.pathname, needBody ? formattedBody : {
+      data: method === "delete" ? formattedBody : undefined,
       params: url.searchParams
     })
     .then((res: any) => {

components/editor/sidebar.tsx

@@ -45,11 +45,7 @@ export const EditorSidebar = ({
                     collections.includes(collection.key),
                 }
               )}
-              onClick={() =>
-                collection.wip
-                  ? () => {}
-                  : handleSetActiveCollection(collection.key)
-              }
+              onClick={() => handleSetActiveCollection(collection.key)}
             >
               <p className="font-semibold uppercase text-xs flex items-center justify-between">
                 {collection.key} API

components/input/input.tsx

@@ -1,4 +1,5 @@
-import React, { ChangeEvent } from "react";
+import React, { ChangeEvent, useState } from "react";
+import { useUpdateEffect } from "react-use";
 
 interface Props {
   value: string;
@@ -10,22 +11,26 @@ interface Props {
 }
 
 export const TextInput: React.FC<Props> = ({
-  value,
+  value: initialValue,
   onChange,
   placeholder,
   subLabel,
   onlyAlphaNumeric = true,
   label,
 }) => {
+  const [value, setValue] = useState(initialValue);
+
   const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {
     const newValue = event.target.value;
     // Only allow numbers or strings
     if (onlyAlphaNumeric && /^[0-9a-zA-Z]*$/.test(newValue)) {
-      return onChange(newValue);
+      return setValue(newValue);
     }
-    onChange(newValue);
+    setValue(newValue);
   };
 
+  useUpdateEffect(() => onChange(value), [value]);
+
   return (
     <div className="w-full relative grid grid-cols-1 gap-2.5">
       <label className="text-slate-400 text-sm font-medium capitalize">

utils/datas/api_collections.ts

@@ -78,7 +78,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
     body: [
       {
         label: "Type of repo (dataset or space; model by default)",
-        defaultValue: "model",
         key: "type",
         required: true,
       },
@@ -108,7 +107,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
     path: '/api/repos/delete',
     body: [{
       label: "Type of repo (dataset or space; model by default)",
-      defaultValue: "model",
       key: "type",
       required: true,
     },
@@ -146,10 +144,9 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
 },
 {
   key: 'collection',
-  wip: true,
   endpoints: [{
     method: 'POST',
-    path: '/api/collections/create',
+    path: '/api/collections',
     body: [{
       label: "Title of collection",
       key: "title",
@@ -165,7 +162,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
     }, {
       label: "Type",
       key: "item.type",
-      defaultValue: "model",
       required: true,
     }, {
       label: "RepoId/PaperId",
@@ -200,7 +196,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
       label: "Theme",
       required: true,
       key: "theme",
-      defaultValue: "green",
     }, {
       label: "Whether the repo is private",
       required: true,
@@ -216,7 +211,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
     body: [{
       label: "Type",
       key: "item.type",
-      defaultValue: "model",
       required: true,
     }, {
       label: "RepoId/PaperId",
@@ -225,7 +219,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
     }, {
       label: "Note",
       key: "note",
-      defaultValue: "Here is the model I trained on ...",
       required: true,
     }]
   }, {
@@ -239,7 +232,6 @@ export const API_COLLECTIONS: Array<ApiCollection> = [{
     }, {
       label: "Note",
       key: "note",
-      defaultValue: "Here is the model I trained on ...",
       required: true,
     }]
   }, {