@strato-admin/core 0.1.0 → 0.3.0

package/dist/strato-core/src/resource/SchemaRegistry.js

@@ -0,0 +1,212 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { createContext, useContext, useState, useCallback, useMemo, Fragment } from 'react';
+import { required, useResourceContext, useResourceDefinition, useGetResourceLabel } from '@strato-admin/ra-core';
+import { FieldSchema, useFieldSchema } from './FieldSchema';
+import { InputSchema, useInputSchema } from './InputSchema';
+const SchemaRegistryContext = createContext(undefined);
+// Use a global store for schemas to ensure they are available even before 
+// components have finished their first render/useEffect cycle.
+const globalSchemaRegistry = {};
+let globalDefaultComponents = {};
+const globalFieldInputMapping = new Map();
+/**
+ * Registers default input components for given field components.
+ * This mapping is used by ResourceSchemaProvider to infer forms.
+ */
+export const registerFieldInputMapping = (mapping) => {
+    mapping.forEach((value, key) => {
+        globalFieldInputMapping.set(key, value);
+    });
+};
+/**
+ * Retrieves the registered default input component for a field.
+ */
+export const getDefaultInputForField = (fieldComponent) => {
+    return globalFieldInputMapping.get(fieldComponent);
+};
+/**
+ * Synchronously registers schemas for a resource.
+ * Can be called during render or outside of React.
+ */
+export const registerGlobalSchemas = (resource, schemas) => {
+    if (!resource)
+        return;
+    const existing = globalSchemaRegistry[resource];
+    // Only update if we actually have new schema content to avoid redundant re-renders
+    if (schemas.fieldSchema ||
+        schemas.inputSchema ||
+        schemas.listFields ||
+        schemas.excludeListFields ||
+        schemas.showFields ||
+        schemas.excludeShowFields ||
+        schemas.formFields ||
+        schemas.excludeFormFields) {
+        globalSchemaRegistry[resource] = {
+            ...existing,
+            ...schemas,
+            fieldSchema: schemas.fieldSchema || existing?.fieldSchema,
+            inputSchema: schemas.inputSchema || existing?.inputSchema,
+        };
+        return true;
+    }
+    return false;
+};
+/**
+ * Parses unified schema children (Field components) into separate
+ * fieldSchema and inputSchema arrays.
+ */
+export const parseUnifiedSchema = (children) => {
+    const fieldSchema = [];
+    const inputSchema = [];
+    const mergeValidation = (isRequired, validate) => {
+        if (!isRequired)
+            return validate;
+        const requiredValidator = required();
+        if (!validate)
+            return requiredValidator;
+        if (Array.isArray(validate)) {
+            return validate.some((v) => v.isRequired) ? validate : [requiredValidator, ...validate];
+        }
+        return validate.isRequired ? validate : [requiredValidator, validate];
+    };
+    const walk = (nodes) => {
+        React.Children.forEach(nodes, (child) => {
+            if (!React.isValidElement(child))
+                return;
+            // Handle Fragments and FieldSchema by recursing into their children
+            if (child.type === Fragment || child.type === FieldSchema) {
+                walk(child.props.children);
+                return;
+            }
+            // Handle explicit InputSchema by only adding to inputSchema
+            if (child.type === InputSchema) {
+                React.Children.forEach(child.props.children, (inputChild) => {
+                    if (React.isValidElement(inputChild)) {
+                        inputSchema.push(inputChild);
+                    }
+                });
+                return;
+            }
+            // The field component itself goes into the field schema
+            fieldSchema.push(child);
+            // Extract input configuration
+            const { source, input, isRequired, description, constraintText, ...rest } = child.props;
+            if (input === false) {
+                return; // Explicitly excluded from inputs
+            }
+            if (React.isValidElement(input)) {
+                // Escape hatch: explicit input component provided
+                const validate = mergeValidation(isRequired, input.props.validate);
+                inputSchema.push(React.cloneElement(input, { ...rest, source, isRequired, validate, description, constraintText }));
+                return;
+            }
+            // Infer default input component
+            const InputComponent = getDefaultInputForField(child.type);
+            if (InputComponent) {
+                const inputProps = input || {};
+                const validate = mergeValidation(isRequired, inputProps.validate);
+                inputSchema.push(_jsx(InputComponent, { ...rest, ...inputProps, source: source, isRequired: isRequired, validate: validate, description: description, constraintText: constraintText }, source));
+            }
+        });
+    };
+    walk(children);
+    return {
+        fieldSchema: fieldSchema.length > 0 ? fieldSchema : undefined,
+        inputSchema: inputSchema.length > 0 ? inputSchema : undefined
+    };
+};
+export const getGlobalSchemas = (resource) => globalSchemaRegistry[resource];
+/**
+ * Registers default components to be used by ResourceSchema when not explicitly provided.
+ */
+export const registerDefaultResourceComponents = (components) => {
+    globalDefaultComponents = { ...globalDefaultComponents, ...components };
+};
+export const getDefaultResourceComponents = () => globalDefaultComponents;
+export const SchemaRegistryProvider = ({ children }) => {
+    // We still use state to trigger re-renders when new schemas are registered dynamically
+    const [, setTick] = useState(0);
+    const registerSchemas = useCallback((resource, schemas) => {
+        const updated = registerGlobalSchemas(resource, schemas);
+        if (updated) {
+            setTick((t) => t + 1);
+        }
+    }, []);
+    const getSchemas = useCallback((resource) => globalSchemaRegistry[resource], []);
+    const value = useMemo(() => ({
+        registerSchemas,
+        getSchemas,
+        defaultComponents: globalDefaultComponents
+    }), [registerSchemas, getSchemas]);
+    return (_jsx(SchemaRegistryContext.Provider, { value: value, children: children }));
+};
+export const useSchemaRegistry = () => {
+    const context = useContext(SchemaRegistryContext);
+    if (!context) {
+        return {
+            registerSchemas: registerGlobalSchemas,
+            getSchemas: getGlobalSchemas,
+            defaultComponents: globalDefaultComponents,
+        };
+    }
+    return context;
+};
+/**
+ * Hook to access all schema-related information for a resource.
+ * It combines information from ResourceContext, FieldSchemaContext, InputSchemaContext,
+ * and the central SchemaRegistry.
+ */
+export const useResourceSchema = (resourceProp) => {
+    const resourceContext = useResourceContext();
+    const resource = resourceProp || resourceContext;
+    const fieldSchemaFromContext = useFieldSchema();
+    const inputSchemaFromContext = useInputSchema();
+    const { getSchemas } = useSchemaRegistry();
+    const definition = useResourceDefinition({ resource });
+    const getResourceLabel = useGetResourceLabel();
+    return useMemo(() => {
+        const isDifferentResource = resourceProp && resourceProp !== resourceContext;
+        let fieldSchema = fieldSchemaFromContext;
+        let inputSchema = inputSchemaFromContext;
+        let listFields = definition?.options?.listFields;
+        let excludeListFields = definition?.options?.excludeListFields;
+        let showFields = definition?.options?.showFields;
+        let excludeShowFields = definition?.options?.excludeShowFields;
+        let formFields = definition?.options?.formFields;
+        let excludeFormFields = definition?.options?.excludeFormFields;
+        // Use registry if we are looking for a different resource,
+        // or if the current context has empty schemas (fallback).
+        if (resource && (isDifferentResource || fieldSchema.length === 0 || inputSchema.length === 0)) {
+            const registrySchemas = getSchemas(resource);
+            if (registrySchemas) {
+                if (isDifferentResource || fieldSchema.length === 0) {
+                    fieldSchema = registrySchemas.fieldSchema ? React.Children.toArray(registrySchemas.fieldSchema) : [];
+                }
+                if (isDifferentResource || inputSchema.length === 0) {
+                    inputSchema = registrySchemas.inputSchema ? React.Children.toArray(registrySchemas.inputSchema) : [];
+                }
+                listFields = listFields || registrySchemas.listFields;
+                excludeListFields = excludeListFields || registrySchemas.excludeListFields;
+                showFields = showFields || registrySchemas.showFields;
+                excludeShowFields = excludeShowFields || registrySchemas.excludeShowFields;
+                formFields = formFields || registrySchemas.formFields;
+                excludeFormFields = excludeFormFields || registrySchemas.excludeFormFields;
+            }
+        }
+        return {
+            resource,
+            fieldSchema,
+            inputSchema,
+            listFields,
+            excludeListFields,
+            showFields,
+            excludeShowFields,
+            formFields,
+            excludeFormFields,
+            definition,
+            label: resource ? getResourceLabel(resource, 2) : undefined, // TODO: stop hardcoding pluralization - translation issues in some languages. 
+            getField: (source) => fieldSchema.find((child) => React.isValidElement(child) && child.props.source === source),
+            getInput: (source) => inputSchema.find((child) => React.isValidElement(child) && child.props.source === source),
+        };
+    }, [resource, resourceProp, resourceContext, fieldSchemaFromContext, inputSchemaFromContext, getSchemas, definition, getResourceLabel]);
+};

package/dist/strato-core/src/resource/index.d.ts

@@ -0,0 +1,6 @@
+export * from './FieldSchema';
+export * from './InputSchema';
+export * from './ResourceSchema';
+export * from './ResourceSchemaProvider';
+export * from './SchemaRegistry';
+export * from './ResourceContext';

package/dist/strato-core/src/resource/index.js

@@ -0,0 +1,6 @@
+export * from './FieldSchema';
+export * from './InputSchema';
+export * from './ResourceSchema';
+export * from './ResourceSchemaProvider';
+export * from './SchemaRegistry';
+export * from './ResourceContext';

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "@strato-admin/core",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "Strato Admin Core Framework",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "default": "dist/index.js"
+      "development": "./src/index.ts",
+      "default": "./dist/index.js"
     }
   },
   "files": [
@@ -29,22 +30,27 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/vgrits/strato-admin.git",
+    "url": "https://github.com/vadimgu/strato-admin.git",
     "directory": "packages/strato-core"
   },
   "dependencies": {
+    "inflection": "^3.0.2",
     "react-intl": "^8.1.3",
-    "@strato-admin/ra-core": "0.1.0"
+    "@strato-admin/ra-core": "0.3.0"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
+    "@types/inflection": "^2.0.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
+    "@types/react-is": "^19.2.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "react-is": "^18.2.0 || ^19.0.0",
+    "react-router-dom": "^7.13.1",
     "typescript": "^5.1.3"
   },
   "scripts": {

package/src/index.ts

@@ -1,5 +1,4 @@
-export * from '@strato-admin/ra-core';
 export * from './resource';
-
-// Resolve ambiguity between ra-core and strato-core resource exports.
-export { ResourceContext } from './resource';
+export * from './routing';
+export * from './settings/SettingsContext';
+export * from './settings/useSettingValue';

package/src/resource/Resource.test.tsx

@@ -0,0 +1,87 @@
+import * as React from 'react';
+import { render, screen } from '@testing-library/react';
+import { describe, it, expect } from 'vitest';
+import { TestMemoryRouter, CoreAdminContext, useRouterProvider } from '@strato-admin/ra-core';
+import { Resource } from './Resource';
+
+const List = () => <div>List</div>;
+const Create = () => <div>Create</div>;
+const Edit = () => <div>Edit</div>;
+const Show = () => <div>Show</div>;
+const Nested = () => <div>Nested</div>;
+
+const ResourceTestWrapper = ({ initialEntries, children }: { initialEntries: string[]; children: React.ReactNode }) => {
+  return (
+    <TestMemoryRouter initialEntries={initialEntries}>
+      <CoreAdminContext>
+        <Wrapper path="/posts/*">{children}</Wrapper>
+      </CoreAdminContext>
+    </TestMemoryRouter>
+  );
+};
+
+const Wrapper = ({ path, children }: { path: string; children: React.ReactNode }) => {
+  const { Route, Routes } = useRouterProvider();
+  return (
+    <Routes>
+      <Route path={path} element={children} />
+    </Routes>
+  );
+};
+
+describe('Resource (Strato)', () => {
+  it('renders the list view at the base path', async () => {
+    render(
+      <ResourceTestWrapper initialEntries={['/posts']}>
+        <Resource name="posts" list={List} />
+      </ResourceTestWrapper>,
+    );
+    await screen.findByText('List');
+  });
+
+  it('renders the create view at /create', async () => {
+    render(
+      <ResourceTestWrapper initialEntries={['/posts/create']}>
+        <Resource name="posts" create={Create} />
+      </ResourceTestWrapper>,
+    );
+    await screen.findByText('Create');
+  });
+
+  it('renders the edit view at /:id/edit', async () => {
+    render(
+      <ResourceTestWrapper initialEntries={['/posts/123/edit']}>
+        <Resource name="posts" edit={Edit} />
+      </ResourceTestWrapper>,
+    );
+    await screen.findByText('Edit');
+  });
+
+  it('renders the show view at /:id (base path)', async () => {
+    render(
+      <ResourceTestWrapper initialEntries={['/posts/123']}>
+        <Resource name="posts" show={Show} />
+      </ResourceTestWrapper>,
+    );
+    await screen.findByText('Show');
+  });
+
+  it('renders nested resources before the base detail view', async () => {
+    const NestedResource = () => {
+      const { Route } = useRouterProvider();
+      return (
+        <Resource name="posts" show={Show}>
+          <Route path=":id/comments" element={<Nested />} />
+        </Resource>
+      );
+    };
+
+    render(
+      <ResourceTestWrapper initialEntries={['/posts/123/comments']}>
+        <NestedResource />
+      </ResourceTestWrapper>,
+    );
+    await screen.findByText('Nested');
+    expect(screen.queryByText('Show')).toBeNull();
+  });
+});

package/src/resource/Resource.tsx

@@ -0,0 +1,62 @@
+import * as React from 'react';
+import { ComponentType, isValidElement } from 'react';
+import { isValidElementType } from 'react-is';
+
+import {
+  ResourceProps,
+  ResourceContextProvider,
+  RestoreScrollPosition,
+  useRouterProvider,
+  Resource as RaResource,
+} from '@strato-admin/ra-core';
+
+/**
+ * Strato version of Resource that implements the new routing scheme:
+ * - Edit: /:id/edit
+ * - Detail (Show): /:id (no suffix)
+ *
+ * This allows for nested resources to be defined under /:id/:subresource
+ * without conflicting with the standard 'show' action.
+ */
+export const Resource = (props: ResourceProps) => {
+  const { create, edit, list, name, show } = props;
+  const { Route, Routes } = useRouterProvider();
+
+  return (
+    <ResourceContextProvider value={name}>
+      <Routes>
+        {create && <Route path="create/*" element={getElement(create)} />}
+        {edit && <Route path=":id/edit/*" element={getElement(edit)} />}
+        {props.children}
+        {show && <Route path=":id/*" element={getElement(show)} />}
+        {list && (
+          <Route
+            path="/*"
+            element={
+              <RestoreScrollPosition storeKey={`${name}.list.scrollPosition`}>{getElement(list)}</RestoreScrollPosition>
+            }
+          />
+        )}
+      </Routes>
+    </ResourceContextProvider>
+  );
+};
+
+const getElement = (ElementOrComponent: ComponentType<any> | React.ReactNode) => {
+  if (isValidElement(ElementOrComponent)) {
+    return ElementOrComponent;
+  }
+
+  if (isValidElementType(ElementOrComponent)) {
+    const Element = ElementOrComponent as ComponentType<any>;
+    return <Element />;
+  }
+
+  return null;
+};
+
+Resource.raName = 'Resource';
+
+// We must delegate to ra-core's registerResource so that the Admin component
+// can correctly discover and register the resource.
+Resource.registerResource = (RaResource as any).registerResource;