@rulab/adminjs-components 0.1.0-alpha.10 → 0.1.0-alpha.12

package/dist/components/Slug/SlugEdit.js

@@ -1,10 +1,16 @@
+import { flat } from "adminjs";
 import React, { useEffect, useState, } from "react";
 import { ThemeProvider } from "styled-components";
 import { theme } from "@adminjs/design-system";
 import { slugifyTitle } from "../../utils/index.js";
 import { StyledCustomInput, StyledGenerateButton, StyledInputWrapper, StyledLabel, } from "./styles.js";
 const SlugEdit = ({ property, record, resource, onChange, }) => {
-    const [inputValue, setInputValue] = useState(record.params.slug);
+    console.log("✅ SlugEdit loaded", { property });
+    const { params } = record;
+    const { custom } = property;
+    const source = flat.get(params, custom.source);
+    const key = flat.get(params, custom.key);
+    const [inputValue, setInputValue] = useState(key);
     useEffect(() => {
         onChange(property.path, inputValue);
     }, [inputValue]);

package/dist/components/Slug/SlugFeature.d.ts

@@ -1,7 +1,4 @@
-import { ComponentLoader, FeatureType } from "adminjs";
-type SlugOptions = {
-    componentLoader: ComponentLoader;
-    key: string;
-};
+import { FeatureType } from "adminjs";
+import SlugOptions from "./SlugOptions.type";
 declare const SlugFeature: (config: SlugOptions) => FeatureType;
 export default SlugFeature;

package/dist/components/Slug/SlugFeature.js

@@ -2,20 +2,18 @@ import { buildFeature } from "adminjs";
 import { bundleComponent } from "../../utils/bundle-component.js";
 const COMPONENT_NAME = 'Slug';
 const SlugFeature = (config) => {
-    const { componentLoader, key } = config;
-    const slugFeature = () => {
-        const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit.js');
-        return buildFeature({
-            properties: {
-                [key]: {
-                    isVisible: { show: false, edit: true, list: false, filter: false },
-                    components: {
-                        edit: editComponent,
-                    },
+    const { componentLoader, source, key } = config;
+    const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit');
+    return buildFeature({
+        properties: {
+            [key]: {
+                isVisible: { filter: true, show: true, edit: true, list: true },
+                components: {
+                    edit: editComponent,
                 },
+                custom: { source, key }
             },
-        });
-    };
-    return slugFeature();
+        },
+    });
 };
 export default SlugFeature;

package/dist/components/Slug/SlugOptions.type.d.ts

@@ -0,0 +1,7 @@
+import { ComponentLoader } from "adminjs";
+type SlugOptions = {
+    componentLoader: ComponentLoader;
+    source: string;
+    key: string;
+};
+export default SlugOptions;

package/dist/components/Slug/SlugOptions.type.js

@@ -0,0 +1 @@
+export {};

package/dist/utils/bundle-component.js

@@ -4,5 +4,5 @@ const dirname = url.fileURLToPath(new URL('.', import.meta.url));
 export const bundleComponent = (loader, componentName, componentFile) => {
     const componentPath = path.join(dirname, '../components', componentName, componentFile);
     console.log('[bundleComponent] Registering:', componentPath);
-    return loader.add(componentName, componentPath);
+    return loader.add(componentFile, componentPath);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rulab/adminjs-components",
-  "version": "0.1.0-alpha.10",
+  "version": "0.1.0-alpha.12",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",

package/src/components/Slug/SlugEdit.tsx

@@ -1,4 +1,4 @@
-import { EditPropertyProps } from "adminjs";
+import {EditPropertyProps, flat} from "adminjs";
 import React, {
   ChangeEvent,
   FC,
@@ -17,7 +17,8 @@ import {
   StyledGenerateButton,
   StyledInputWrapper,
   StyledLabel,
-} from "./styles.js";
+} from "./styles";
+import SlugOptions from "./SlugOptions.type";
 
 type CustomSlugTypes = Omit<EditPropertyProps, "where">;
 
@@ -27,7 +28,18 @@ const SlugEdit: FC<CustomSlugTypes> = ({
   resource,
   onChange,
 }) => {
-  const [inputValue, setInputValue] = useState(record.params.slug);
+  console.log("✅ SlugEdit loaded", { property });
+  type SlugCustomProperty = {
+    source: string,
+    key: string
+  }
+  const { params } = record
+  const { custom } = property as unknown as { custom: SlugCustomProperty }
+
+  const source = flat.get(params, custom.source)
+  const key = flat.get(params, custom.key)
+
+  const [inputValue, setInputValue] = useState(key);
 
   useEffect(() => {
     onChange(property.path, inputValue);

package/src/components/Slug/SlugFeature.ts

@@ -1,30 +1,26 @@
 import {buildFeature, ComponentLoader, FeatureType} from "adminjs";
 import {bundleComponent} from "../../utils/bundle-component";
+import SlugOptions from "./SlugOptions.type";
 
 const COMPONENT_NAME = 'Slug'
 
-type SlugOptions = {
-    componentLoader: ComponentLoader
-    key: string
-}
 const SlugFeature = (config: SlugOptions): FeatureType => {
-    const {componentLoader,key} = config
+    const {componentLoader,source,key} = config
+
+    const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit')
 
-    const slugFeature = () => {
-        const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit.js')
-        return buildFeature({
-            properties: {
-                [key]: {
-                    isVisible: { show: false, edit: true, list: false, filter: false },
-                    components: {
-                        edit: editComponent,
-                    },
+    return buildFeature({
+        properties: {
+            [key]: {
+                isVisible: { filter: true, show: true, edit: true, list: true },
+                components: {
+                    edit: editComponent,
                 },
+                custom: {source,key}
             },
-        })
-    }
+        },
+    })
 
-    return slugFeature()
 }
 
 export default SlugFeature

package/src/components/Slug/SlugOptions.type.ts

@@ -0,0 +1,9 @@
+import {ComponentLoader} from "adminjs";
+
+type SlugOptions = {
+    componentLoader: ComponentLoader
+    source: string
+    key: string
+}
+
+export default SlugOptions