integrate api workspaces

frontend/package.json

@@ -24,6 +24,7 @@
     "axios": "^0.21.1",
     "colormap": "^2.3.2",
     "flexlayout-react": "^0.5.12",
+    "moment": "^2.29.4",
     "notistack": "^2.0.3",
     "plotly.js": "^2.6.0",
     "qs": "^6.11.2",

frontend/src/api/Workspace/index.ts

@@ -0,0 +1,38 @@
+import axios from "utils/axios"
+import qs from 'qs'
+
+export type Data = {
+  name?: string
+  id?: number
+}
+
+export const getWorkspacesApi = async (params: { [key: string]: number}) => {
+  const paramsNew = qs.stringify(params, { indices: false })
+  const response = await axios.get(`/workspaces?${paramsNew}`)
+  return response.data
+}
+
+export const delWorkspaceApi = async (id: number) => {
+  const response = await axios.delete(`/workspace/${id}`)
+  return response.data
+}
+
+export const postWorkspaceApi = async (data: Data) => {
+  const response = await axios.post(`/workspace`, data)
+  return response.data
+}
+
+export const putWorkspaceApi = async (data: Data) => {
+  const response = await axios.put(`/workspace/${data.id}`, {name: data.name})
+  return response.data
+}
+
+export const importWorkspaceApi = async (data: Object) => {
+  const response = await axios.post(`/workspace/import`, {todo_dummy: data})
+  return response.data
+}
+
+export const exportWorkspaceApi = async (id: number) => {
+  const response = await axios.get(`/workspace/export/${id}`)
+  return response.data
+}

frontend/src/api/users/UsersApiDTO.ts

@@ -1,4 +1,5 @@
 export type UserDTO = {
+  id: number
   uid: string
   email: string
 }

frontend/src/components/Database/DatabaseCells.tsx

@@ -124,23 +124,23 @@ const DatabaseCells = ({ user }: CellProps) => {
 
   const dataParamsFilter = useMemo(
     () => ({
-      brain_area: searchParams.get('brain_area') || '',
-      cre_driver: searchParams.get('cre_driver') || '',
-      reporter_line: searchParams.get('reporter_line') || '',
+      brain_area: searchParams.get('brain_area') || undefined,
+      cre_driver: searchParams.get('cre_driver') || undefined,
+      reporter_line: searchParams.get('reporter_line') || undefined,
       imaging_depth: Number(searchParams.get('imaging_depth')) || undefined,
     }),
     [searchParams],
   )
 
   const fetchApi = () => {
     const api = !user ? getCellsPublicDatabase : getCellsDatabase
-    dispatch(api(dataParams))
+    dispatch(api({...dataParamsFilter, ...dataParams}))
   }
 
   useEffect(() => {
     fetchApi()
     //eslint-disable-next-line
-  }, [dataParams, user])
+  }, [dataParams, user, dataParamsFilter])
 
   const handleOpenDialog = (data: string[]) => {
     setDataDialog({ type: 'image', data })
@@ -181,30 +181,22 @@ const DatabaseCells = ({ user }: CellProps) => {
   )
 
   const handleFilter = (
-    model: GridFilterModel | any,
-    details: GridCallbackDetails,
+      model: GridFilterModel | any,
+      details: GridCallbackDetails,
   ) => {
     let filter: string
     if (!!model.items[0]?.value) {
-      //todo multiple filter with version pro. Issue task #55
       filter = model.items
-        .filter((item: { [key: string]: string }) => item.value)
-        .map((item: any) => {
-          return `${item.field}=${item?.value}`
-        })
-        .join('&')
+          .filter((item: { [key: string]: string }) => item.value)
+          .map((item: any) => {
+            return `${item.field}=${item?.value}`
+          })
+          .join('&')
     } else {
       filter = ''
     }
-    if (!model.items[0]) {
-      setParams(
-        `${filter}&sort=${dataParams.sort[0]}&sort=${dataParams.sort[1]}&${pagiFilter}`,
-      )
-      return
-    }
-    setParams(
-      `${filter}&sort=${dataParams.sort[0]}&sort=${dataParams.sort[1]}&${pagiFilter}`,
-    )
+    const {sort} = dataParams
+    setParams(`${filter}&sort=${sort[0] || ''}&sort=${sort[1] || ''}&${pagiFilter}`)
   }
 
   const getColumns = useMemo(() => {