feat: improve types

src/guillo-gmi/actions/add_item.tsx

@@ -13,7 +13,7 @@ export function AddItem(props: Props) {
   const { type } = props
   const { getForm } = Ctx.registry
 
-  const Form = getForm(type)
+  const Form = getForm(type, undefined)
 
   const setActive = () => {
     Ctx.cancelAction()

src/guillo-gmi/components/panel/items.tsx

@@ -20,12 +20,7 @@ import { Input } from '../input/input'
 import { SelectVocabulary } from '../input/select_vocabulary'
 import { useIntl } from 'react-intl'
 import { genericMessages } from '../../locales/generic_messages'
-
-import {
-  ItemColumn,
-  RegistrySchemaFilter,
-  SearchItem,
-} from '../../types/guillotina'
+import { RegistrySchemaFilter, SearchItem } from '../../types/guillotina'
 
 interface InitialState {
   page: number
@@ -124,7 +119,8 @@ export function PanelItems() {
       const fnName = getSearchEngineQueryParamsFunction(SearchEngine)
       if (sortParsed === undefined) {
         const defaultSortValue = Ctx.registry.getDefaultSortValue(
-          Ctx.context['@type']
+          Ctx.context['@type'],
+          undefined
         )
         sortParsed = parser(
           `_sort_${defaultSortValue.direction}=${defaultSortValue.key}`
@@ -339,7 +335,7 @@ export function PanelItems() {
               <th>
                 <AllItemsCheckbox />
               </th>
-              {columns.map((column: ItemColumn) => (
+              {columns.map((column) => (
                 <th
                   key={`table-col-${column.label}`}
                   onClick={() => column.isSortable && onSort(column.key)}

src/guillo-gmi/contexts/index.tsx

@@ -7,6 +7,7 @@ import {
   GuillotinaReducerActionTypes,
 } from '../reducers/guillotina'
 import { GuillotinaCommonObject } from '../types/guillotina.js'
+import { IManageRegistry } from '../hooks/useRegistry.js'
 
 export const AuthContext = createContext({})
 
@@ -20,7 +21,7 @@ interface PropsTraversal {
     type: GuillotinaReducerActionTypes
     payload: IndexSignature
   }>
-  registry: IndexSignature
+  registry: IManageRegistry
   flash?: (action: string, result: string) => void
   url: string
   children?: React.ReactNode

src/guillo-gmi/forms/base.tsx

@@ -5,20 +5,21 @@ import { stringToSlug } from '../lib/helpers'
 import { useIntl } from 'react-intl'
 import { genericMessages } from '../locales/generic_messages'
 
-interface Props {
+export interface BaseFormProps {
   onSubmit: (data: { title: string; id: string }) => void
   actionName?: string
   title?: string
   dataTest?: string
   loading?: boolean
+  type: string
 }
 export function BaseForm({
   onSubmit,
   actionName,
   title,
   dataTest,
   loading,
-}: Props) {
+}: BaseFormProps) {
   const intl = useIntl()
   const [name, setName] = useState('')
   const [id, setId] = useState('')

src/guillo-gmi/hooks/useRegistry.tsx

@@ -13,7 +13,7 @@ import { RemoveItems } from '../actions/remove_items'
 import { RemoveItem } from '../actions/remove_item'
 import { AddItem } from '../actions/add_item'
 import { ChangePassword } from '../actions/change_pass'
-import { BaseForm } from '../forms/base'
+import { BaseForm, BaseFormProps } from '../forms/base'
 import { UserForm } from '../forms/users'
 import { IAttachment } from '../components/behaviors/iattachment'
 import { IDublinCore } from '../components/behaviors/idublincore'
@@ -35,7 +35,18 @@ import {
   ItemColumn,
   RegistrySchema,
 } from '../types/guillotina'
+import { buildQs, parser } from '../lib/search'
 
+export interface RegistrySortValue {
+  direction: 'asc' | 'des'
+  key: string
+}
+export interface RegistryProperties {
+  Buttons: React.ReactElement
+  Panels: React.ReactElement
+  default: string[]
+  ignoreField: string[]
+}
 export interface IRegistry {
   paths: {
     [key: string]: React.FC
@@ -59,7 +70,7 @@ export interface IRegistry {
     [key: string]: RegistrySchema
   }
   properties: {
-    [key: string]: React.FC
+    [key: string]: RegistryProperties
   }
   components: {
     [key: string]: (props: any) => React.ReactNode | null | undefined
@@ -70,11 +81,11 @@ export interface IRegistry {
   fieldsToFilter: {
     [key: string]: string[]
   }
+  parsedSearchQueryParam: {
+    [key: string]: (query: string, type: string) => string
+  }
   defaultSortValue: {
-    [key: string]: {
-      direction: 'asc' | 'des'
-      key: string
-    }
+    [key: string]: RegistrySortValue
   }
 }
 
@@ -136,6 +147,7 @@ const registry: IRegistry = {
   fieldsToFilter: {
     UserManager: ['id', 'email', 'user_name'],
   },
+  parsedSearchQueryParam: {},
   defaultSortValue: {},
 }
 
@@ -148,20 +160,18 @@ export interface IManageRegistry {
   ) => React.ComponentType<any>
   getComponent: (name: string) => React.ComponentType<any>
   getView: (name: string) => React.ComponentType<any>
-  getForm: (type: string, fallback: React.FC) => React.FC
+  getForm: (type: string, fallback?: React.FC) => React.FC<BaseFormProps>
   getAction: (type: string, fallback?: React.FC) => React.FC
-  getBehavior: (type: string, fallback: React.FC) => React.FC
-  getProperties: (type: string) => React.FC
+  getBehavior: (type: string, fallback?: React.FC) => React.FC<any>
+  getProperties: (type: string) => RegistryProperties
   getItemsColumn: (type: string) => ItemColumn[] | undefined
   getSchemas: (type: string) => RegistrySchema
   getFieldsToFilter: (type: string, fallback?: string[]) => string[]
+  getParsedSearchQueryParam: (query: string, type: string) => string
   getDefaultSortValue: (
     type: string,
-    fallback: { direction: 'asc' | 'des'; key: string }
-  ) => {
-    key: string
-    direction: 'asc' | 'des'
-  }
+    fallback?: RegistrySortValue
+  ) => RegistrySortValue
   getSearchEngineQueryParamsFunction: (type: string) => string
 }
 
@@ -202,15 +212,15 @@ const getView = (name: string) => {
   return registry.views[name]
 }
 
-const getForm = (type: string, fallback: React.FC) => {
+const getForm = (type: string, fallback?: React.FC<BaseFormProps>) => {
   return registry.forms[type] || fallback || BaseForm
 }
 
 const getAction = (type: string, fallback?: React.FC) => {
   return registry.actions[type] || fallback
 }
 
-const getBehavior = (type: string, fallback: React.FC) => {
+const getBehavior = (type: string, fallback?: React.FC) => {
   return registry.behaviors[type] || fallback
 }
 
@@ -228,7 +238,7 @@ const getFieldsToFilter = (type: string, fallback: string[] = ['title']) => {
 
 const getDefaultSortValue = (
   type: string,
-  fallback = {
+  fallback: RegistrySortValue | undefined = {
     key: 'id',
     direction: 'des',
   }
@@ -240,6 +250,15 @@ const getSearchEngineQueryParamsFunction = (type: string) => {
   return registry.searchEngineQueryParamsFunction[type]
 }
 
+const getParsedSearchQueryParam = (query: string, type: string) => {
+  const parsedFunction = registry.parsedSearchQueryParam[type]
+  if (!parsedFunction) {
+    const fieldsToFilter = getFieldsToFilter(type)
+    return buildQs(parser(query, fieldsToFilter))
+  }
+  return parsedFunction(query, type)
+}
+
 export const defaultComponent = (context: GuillotinaCommonObject) => {
   return context.is_folderish ? FolderCtx : ItemCtx
 }
@@ -268,6 +287,7 @@ export function useRegistry(data: Partial<IRegistry>): IManageRegistry {
     getProperties,
     getItemsColumn,
     getFieldsToFilter,
+    getParsedSearchQueryParam,
     getDefaultSortValue,
     getSchemas,
     getView,

src/guillo-gmi/lib/client.tsx

@@ -10,6 +10,7 @@ import { Auth } from './auth'
 import {
   GuillotinaGroup,
   GuillotinaUser,
+  ItemColumn,
   ItemColumnChild,
   ReturnSearchCompatible,
 } from '../types/guillotina'
@@ -127,12 +128,13 @@ export class GuillotinaClient {
     return result
   }
 
-  getItemsColumn() {
+  getItemsColumn(): ItemColumn[] {
     const smallcss = { width: 25 }
     const mediumcss = { width: 120 }
 
     return [
       {
+        key: 'icon',
         label: '',
         isSortable: false,
         child: ({ model }: ItemColumnChild) => (

src/guillo-gmi/lib/search.ts

@@ -2,7 +2,10 @@ const SEP = '='
 const DEFAULT_FIELD = 'title__in'
 const CLEANER = '||'
 
-export function parser(qs: string, defaultField = DEFAULT_FIELD): string[][] {
+export function parser(
+  qs: string,
+  defaultField: string | string[] | undefined = DEFAULT_FIELD
+): string[][] {
   if (qs.includes(SEP) && Array.isArray(defaultField)) {
     throw new Error('This option is not supported')
   }