@primershop/strapi-plugin-status-manager 0.0.14 → 0.0.16

package/dist/admin/{components/StatusManager.js → HomePage-Bez9ZXv-.js}

@@ -1,6 +1,8 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
+var designSystem = require('@strapi/design-system');
+var admin = require('@strapi/strapi/admin');
 var React = require('react');
 var combine = require('@atlaskit/pragmatic-drag-and-drop/combine');
 var adapter = require('@atlaskit/pragmatic-drag-and-drop/element/adapter');
@@ -8,9 +10,8 @@ var pointerOutsideOfPreview = require('@atlaskit/pragmatic-drag-and-drop/element
 var setCustomNativeDragPreview = require('@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview');
 var reorder = require('@atlaskit/pragmatic-drag-and-drop/reorder');
 var closestEdge = require('@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge');
-var designSystem = require('@strapi/design-system');
 var icons = require('@strapi/icons');
-var admin = require('@strapi/strapi/admin');
+var index = require('./index-mATo7IeG.js');
 
 const StatusManager = ()=>{
     const [statuses, setStatuses] = React.useState([]);
@@ -363,5 +364,49 @@ const StatusManager = ()=>{
     });
 };
 
-exports.StatusManager = StatusManager;
-//# sourceMappingURL=StatusManager.js.map
+const HomePage = ()=>{
+    return /*#__PURE__*/ jsxRuntime.jsxs(admin.Layouts.Root, {
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Title, {
+                children: "Status Manager"
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Main, {
+                children: /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Protect, {
+                    permissions: index.pluginPermissions.accessStatusManager,
+                    children: /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Content, {
+                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+                                padding: 10,
+                                gap: {
+                                    initial: 1,
+                                    medium: 4,
+                                    large: 8
+                                },
+                                direction: {
+                                    initial: "column",
+                                    medium: "row"
+                                },
+                                alignItems: {
+                                    initial: "center",
+                                    medium: "flex-start"
+                                },
+                                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Box, {
+                                    padding: 1,
+                                    children: [
+                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                            variant: "alpha",
+                                            children: "Status manager"
+                                        }),
+                                        /*#__PURE__*/ jsxRuntime.jsx(StatusManager, {})
+                                    ]
+                                })
+                            })
+                        })
+                    })
+                })
+            })
+        ]
+    });
+};
+
+exports.HomePage = HomePage;

package/dist/admin/{components/StatusManager.mjs → HomePage-Dx9N0awm.mjs}

@@ -1,4 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { Box, Typography, Flex, TextInput, Button, Dialog, SingleSelect, SingleSelectOption } from '@strapi/design-system';
+import { useFetchClient, Layouts, Page } from '@strapi/strapi/admin';
 import { useState, useEffect, useCallback } from 'react';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
 import { draggable, dropTargetForElements, monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
@@ -6,9 +8,8 @@ import { pointerOutsideOfPreview } from '@atlaskit/pragmatic-drag-and-drop/eleme
 import { setCustomNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview';
 import { reorder } from '@atlaskit/pragmatic-drag-and-drop/reorder';
 import { extractClosestEdge, attachClosestEdge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
-import { Box, Typography, Flex, TextInput, Button, Dialog, SingleSelect, SingleSelectOption } from '@strapi/design-system';
 import { Plus, Drag, Trash } from '@strapi/icons';
-import { useFetchClient } from '@strapi/strapi/admin';
+import { p as pluginPermissions } from './index-BVybZ6IA.mjs';
 
 const StatusManager = ()=>{
     const [statuses, setStatuses] = useState([]);
@@ -361,5 +362,49 @@ const StatusManager = ()=>{
     });
 };
 
-export { StatusManager };
-//# sourceMappingURL=StatusManager.mjs.map
+const HomePage = ()=>{
+    return /*#__PURE__*/ jsxs(Layouts.Root, {
+        children: [
+            /*#__PURE__*/ jsx(Page.Title, {
+                children: "Status Manager"
+            }),
+            /*#__PURE__*/ jsx(Page.Main, {
+                children: /*#__PURE__*/ jsx(Page.Protect, {
+                    permissions: pluginPermissions.accessStatusManager,
+                    children: /*#__PURE__*/ jsx(Layouts.Content, {
+                        children: /*#__PURE__*/ jsx(Box, {
+                            children: /*#__PURE__*/ jsx(Flex, {
+                                padding: 10,
+                                gap: {
+                                    initial: 1,
+                                    medium: 4,
+                                    large: 8
+                                },
+                                direction: {
+                                    initial: "column",
+                                    medium: "row"
+                                },
+                                alignItems: {
+                                    initial: "center",
+                                    medium: "flex-start"
+                                },
+                                children: /*#__PURE__*/ jsxs(Box, {
+                                    padding: 1,
+                                    children: [
+                                        /*#__PURE__*/ jsx(Typography, {
+                                            variant: "alpha",
+                                            children: "Status manager"
+                                        }),
+                                        /*#__PURE__*/ jsx(StatusManager, {})
+                                    ]
+                                })
+                            })
+                        })
+                    })
+                })
+            })
+        ]
+    });
+};
+
+export { HomePage };

package/dist/admin/index-BVybZ6IA.mjs

@@ -0,0 +1,280 @@
+import React, { useRef, useEffect, useState, useCallback } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { CheckCircle } from '@strapi/icons';
+import { Flex, Box, Typography, SingleSelect, SingleSelectOption } from '@strapi/design-system';
+import { unstable_useContentManagerContext, useFetchClient, useQueryParams } from '@strapi/strapi/admin';
+
+const PLUGIN_ID = "primershop-status-manager";
+
+/**
+ * @type {import('react').FC<{ setPlugin: (id: string) => void }>}
+ */ const Initializer = ({ setPlugin })=>{
+    const ref = useRef(setPlugin);
+    useEffect(()=>{
+        ref.current(PLUGIN_ID);
+    }, []);
+    return null;
+};
+
+const PluginIcon = ()=>/*#__PURE__*/ jsx(CheckCircle, {});
+
+const ProductStatusField = ()=>{
+    const { contentType, id } = unstable_useContentManagerContext();
+    const [statuses, setStatuses] = useState([]);
+    const [currentStatus, setCurrentStatus] = useState("");
+    const [message, setMessage] = useState("");
+    const { get, put } = useFetchClient();
+    const handleStatusChange = useCallback(async (newStatus)=>{
+        if (!id) {
+            setMessage("Save the product first and then change the status");
+            return;
+        }
+        try {
+            await put(`primershop-status-manager/content-status`, {
+                contentTypeUid: "api::product.product",
+                contentDocumentId: id,
+                statusId: statuses.find((status)=>status.name === newStatus)?.documentId
+            });
+            setMessage(`Status updated ${currentStatus ? `from ${currentStatus}` : ""} to ${newStatus}`);
+            setCurrentStatus(newStatus || "");
+        } catch (error) {
+            setMessage("Error updating status");
+            console.error("Error updating status:", error);
+        }
+    }, [
+        id,
+        statuses,
+        currentStatus,
+        put
+    ]);
+    useEffect(()=>{
+        async function fetchCurrentStatus() {
+            try {
+                const { data: productData } = await get(`primershop-status-manager/content-status?contentDocumentId=${id}&contentTypeUid=api::product.product`);
+                const status = productData?.status;
+                if (status && status.name) return setCurrentStatus(status.name);
+                if (statuses.length) return handleStatusChange(statuses[0].name);
+            } catch (error) {
+                console.error("Error fetching product status:", error);
+            }
+        }
+        if (id && !currentStatus.length) fetchCurrentStatus();
+        if (!id && statuses.length) setCurrentStatus(statuses[0].name);
+    }, [
+        id,
+        statuses,
+        get
+    ]);
+    useEffect(()=>{
+        async function fetchStatuses() {
+            try {
+                const { data } = await get("primershop-status-manager/statuses");
+                setStatuses(data);
+            } catch (error) {
+                console.error("Error fetching statuses:", error);
+            }
+        }
+        fetchStatuses();
+    }, [
+        get
+    ]);
+    return /*#__PURE__*/ jsxs(Flex, {
+        direction: "column",
+        justifyContent: "center",
+        alignItems: "stretch",
+        width: "100%",
+        children: [
+            /*#__PURE__*/ jsx(Box, {
+                padding: 2,
+                children: /*#__PURE__*/ jsxs(Typography, {
+                    variant: "sigma",
+                    children: [
+                        contentType?.info.displayName,
+                        " status"
+                    ]
+                })
+            }),
+            /*#__PURE__*/ jsx(SingleSelect, {
+                placeholder: currentStatus,
+                onChange: handleStatusChange,
+                children: statuses.map((status)=>/*#__PURE__*/ jsx(SingleSelectOption, {
+                        value: status.name,
+                        children: status.name
+                    }, status.documentId))
+            }),
+            /*#__PURE__*/ jsx(Box, {
+                padding: 2,
+                children: /*#__PURE__*/ jsx(Typography, {
+                    variant: "sigma",
+                    children: message
+                })
+            })
+        ]
+    });
+};
+
+const StatusCell = ({ row })=>{
+    const [status, setStatus] = useState(null);
+    useEffect(()=>{
+        setStatus(row.statusField);
+    }, [
+        row
+    ]);
+    if (!status) return null;
+    return /*#__PURE__*/ jsx("span", {
+        style: {
+            padding: "4px 8px",
+            borderRadius: 4,
+            background: status.published ? "#eafbe7" : "#f0f0ff",
+            color: status.published ? "#2f6846" : "#271fe0",
+            border: `1px solid ${status.published ? "#2f6846" : "#271fe0"}`,
+            fontSize: 14
+        },
+        children: status.name
+    });
+};
+
+const addStatusColumnHook = ({ displayedHeaders, layout })=>{
+    const statusHeader = {
+        attribute: {
+            type: "custom"
+        },
+        name: "statusLabel",
+        label: {
+            id: "primershop-status-manager.status",
+            defaultMessage: "Status"
+        },
+        searchable: false,
+        sortable: false,
+        cellFormatter: (row)=>{
+            return React.createElement(StatusCell, {
+                row
+            });
+        }
+    };
+    return {
+        displayedHeaders: [
+            ...displayedHeaders,
+            statusHeader
+        ],
+        layout
+    };
+};
+
+/**
+ * Admin permission actions for use in addMenuLink, Page.Protect, and useRBAC.
+ * Action IDs must match uids registered in server bootstrap (registerMany).
+ */ const pluginPermissions = {
+    accessStatusManager: [
+        {
+            action: "plugin::primershop-status-manager.main",
+            subject: null
+        }
+    ]
+};
+
+const StatusFilter = ()=>{
+    const { contentType } = unstable_useContentManagerContext();
+    const [statuses, setStatuses] = useState([]);
+    const [selected, setSelected] = useState("");
+    const { get } = useFetchClient();
+    const [{ query }, setQuery] = useQueryParams();
+    const handleStatusChange = useCallback((name)=>{
+        setQuery({
+            page: 1,
+            plugins: {
+                ...query.plugins,
+                "primershop-status-manager": {
+                    statusName: name.toLowerCase()
+                }
+            }
+        }, "push", true);
+    }, [
+        query.plugins,
+        setQuery
+    ]);
+    useEffect(()=>{
+        const selectedStatusName = query.plugins?.["primershop-status-manager"]?.statusName;
+        if (!selectedStatusName) return;
+        const status = statuses.find((status)=>status.name.toLowerCase() === selectedStatusName);
+        if (status) {
+            setSelected(status.name);
+        }
+    }, [
+        query,
+        statuses
+    ]);
+    useEffect(()=>{
+        async function fetchStatuses() {
+            try {
+                const { data } = await get("primershop-status-manager/statuses");
+                const allStatusesObject = {
+                    documentId: "all",
+                    name: "All"
+                };
+                setStatuses([
+                    allStatusesObject,
+                    ...data
+                ]);
+            } catch (error) {
+                console.error("Error fetching statuses:", error);
+            }
+        }
+        fetchStatuses();
+    }, [
+        get
+    ]);
+    return /*#__PURE__*/ jsx(Flex, {
+        direction: "column",
+        justifyContent: "center",
+        children: /*#__PURE__*/ jsx(SingleSelect, {
+            size: "S",
+            placeholder: `${contentType?.info.displayName} status`,
+            value: selected,
+            onChange: handleStatusChange,
+            children: statuses.map((status)=>/*#__PURE__*/ jsx(SingleSelectOption, {
+                    value: status.name,
+                    children: status.name
+                }, status.documentId))
+        })
+    });
+};
+
+const plugin = {
+    register (app) {
+        app.registerPlugin({
+            id: PLUGIN_ID,
+            initializer: Initializer,
+            isReady: true,
+            name: PLUGIN_ID
+        });
+        app.addMenuLink({
+            to: `plugins/${PLUGIN_ID}`,
+            icon: PluginIcon,
+            intlLabel: {
+                id: `${PLUGIN_ID}.plugin.name`,
+                defaultMessage: "Status manager"
+            },
+            permissions: [
+                pluginPermissions.accessStatusManager[0]
+            ],
+            Component: ()=>import('./HomePage-Dx9N0awm.mjs').then((module)=>({
+                        default: module.HomePage
+                    }))
+        });
+    },
+    bootstrap (app) {
+        app.getPlugin("content-manager").injectComponent("editView", "right-links", {
+            name: "Status",
+            Component: ProductStatusField
+        });
+        app.registerHook('Admin/CM/pages/ListView/inject-column-in-table', addStatusColumnHook);
+        const contentManager = app.getPlugin('content-manager');
+        contentManager.injectComponent('listView', 'actions', {
+            name: 'status-filter',
+            Component: StatusFilter
+        });
+    }
+};
+
+export { plugin as a, pluginPermissions as p };