WIP: query panel

src/components/fdos/create.tsx

@@ -128,7 +128,6 @@ const FileUpload: React.FC<any> = ({ register, errors, name, label, setError })
     validate
   })
 
-  console.log(inputProps)
   const onChange = (e: any) => {
     setFiles(e.target?.files)
     inputProps.onChange(e)
@@ -164,10 +163,8 @@ const StepData: React.FC<any> = ({ register, errors }) => {
 export const FdoCreate: React.FC<IResourceComponentsProps> = () => {
   const go = useGo()
   const accessToken = useAccessToken()
-  console.log('accessToken: ', accessToken)
 
   const formRet = useStepsForm<any, HttpError, any>({ defaultValues: { repository: '', profile: '' }, refineCoreProps: { meta: { headers: { Authentication: `Bearer ${accessToken}` } } } })
-  console.log('formRet', formRet)
   const {
     setError,
     saveButtonProps,
@@ -189,8 +186,6 @@ export const FdoCreate: React.FC<IResourceComponentsProps> = () => {
   }
 
   const onSubmit = (data: any) => {
-    console.log('data', data)
-
     onFinish([{ fdo: data.repository }, data.fdo_data[0], data.fdo_metadata[0]])
   }
   const theme = useTheme()

src/components/fdos/list.tsx

@@ -25,7 +25,6 @@ const columns: Array<GridColDef<OperationsLogRecord>> = [
     flex: 1,
     type: 'string',
     renderCell: (params): any => {
-      console.log('params', params)
       return <Link href={`/fdo/show/${params.id}`}>{params.id}</Link>
     }
   }, {

src/components/header/QueryPanel.tsx

+import { useState } from 'react'
+import Paper from '@mui/material/Paper'
+import InputBase from '@mui/material/InputBase'
+import IconButton from '@mui/material/IconButton'
+import SearchIcon from '@mui/icons-material/Search'
+import FormHelperText from '@mui/material/FormHelperText'
+import FormControl from '@mui/material/FormControl'
+import { useGo, useNotification } from '@refinedev/core'
+
+export default function QueryPanel () {
+  const [pid, setPid] = useState('')
+  const [error, setError] = useState<string | boolean>(false)
+  const go = useGo()
+  const onChange = (e: any) => {
+    setPid(e.target.value)
+    setError(false)
+  }
+  const onSubmit = (e: any) => {
+    e.preventDefault()
+    if (!pid.includes('/')) {
+      setError('prefix / suffix')
+      return false
+    }
+
+    const prefix = pid?.split('/', 1)[0]
+    const suffix = pid?.substring(prefix.length + 1)
+    go({ to: { resource: 'fdo', action: 'show', id: pid, meta: { prefix, suffix } }, type: 'push' })
+  }
+  return (
+    <FormControl error={!!error}>
+    <Paper
+      component="form"
+      sx={{ p: '2px 4px', display: 'flex', alignItems: 'center', width: 400 }}
+      onSubmit={onSubmit}
+    >
+      <FormHelperText>{error}</FormHelperText>
+      <InputBase
+        sx={{ flex: 1 }}
+        placeholder="Resolve PID"
+        inputProps={{ 'aria-label': 'resolve pid' }}
+        value={pid}
+        onChange={onChange}
+      />
+      <IconButton onClick={onSubmit} type="button" sx={{ p: '10px' }} aria-label="search">
+        <SearchIcon />
+      </IconButton>
+    </Paper>
+    </FormControl>
+  )
+}

src/components/header/index.tsx

@@ -16,6 +16,7 @@ import Link from 'next/link'
 import { useRouter } from 'next/router'
 import React, { useContext } from 'react'
 import UserComponent from './UserComponent'
+import QueryPanel from './QueryPanel'
 
 export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({
   sticky = true
@@ -38,6 +39,7 @@ export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({
             alignItems="center"
             gap="16px"
           >
+            <QueryPanel/>
             <FormControl sx={{ minWidth: 64 }}>
               <Select
                 disableUnderline

src/components/repositories/list.tsx

@@ -43,7 +43,6 @@ const columns: Array<GridColDef<IRepository>> = [
 
 export const RepositoriesList: React.FC<IResourceComponentsProps> = () => {
   const { dataGridProps } = useDataGrid<IRepository>()
-  console.log('repositoriesList', dataGridProps)
 
   return (
     <List>

src/utils.tsx

@@ -14,7 +14,6 @@ export const useAccessToken: any = () => {
   const { mutate: logout } = useLogout()
   const { open } = useNotification()
 
-  console.log('useAccessToken', identity)
   const data = identity?.data?.data
 
   if (data?.accessToken == null) {