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

package/dist/admin/HomePage-Dx9N0awm.mjs

@@ -1,410 +0,0 @@
-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';
-import { pointerOutsideOfPreview } from '@atlaskit/pragmatic-drag-and-drop/element/pointer-outside-of-preview';
-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 { Plus, Drag, Trash } from '@strapi/icons';
-import { p as pluginPermissions } from './index-BVybZ6IA.mjs';
-
-const StatusManager = ()=>{
-    const [statuses, setStatuses] = useState([]);
-    const [newStatus, setNewStatus] = useState("");
-    const [statusToDelete, setStatusToDelete] = useState(null);
-    const [replacementStatus, setReplacementStatus] = useState("");
-    const { get, post, put } = useFetchClient();
-    const [instanceId] = useState(()=>Symbol("instance-id"));
-    // Fetch statuses
-    useEffect(()=>{
-        const loadStatuses = async ()=>{
-            const { data } = await get("primershop-status-manager/statuses");
-            setStatuses(data);
-        };
-        loadStatuses();
-    }, [
-        get
-    ]);
-    // Validate input (Latin characters only)
-    const validateInput = (value)=>/^[a-zA-Z\s]+$/.test(value);
-    // Add new status
-    const addStatus = async ()=>{
-        if (!newStatus || !validateInput(newStatus)) return alert("Only Latin characters allowed!");
-        try {
-            const { data } = await post("primershop-status-manager/status", {
-                name: newStatus,
-                published: false
-            });
-            setStatuses([
-                ...statuses,
-                data
-            ]);
-            setNewStatus("");
-        } catch (error) {
-            console.error("Error creating status:", error);
-        }
-    };
-    const reorderItem = useCallback(async ({ startIndex, indexOfTarget, closestEdgeOfTarget })=>{
-        // Calculate the final index based on the target position and edge
-        let finishIndex = indexOfTarget;
-        if (closestEdgeOfTarget === "bottom") {
-            finishIndex = indexOfTarget + 1;
-        }
-        // If moving an item down, we need to adjust for the removed item
-        if (startIndex < finishIndex) {
-            finishIndex--;
-        }
-        if (finishIndex === startIndex) {
-            return;
-        }
-        const reordered = reorder({
-            list: statuses,
-            startIndex,
-            finishIndex
-        });
-        // Send new order to API
-        const orderedIds = reordered.map((status, index)=>({
-                documentId: status.documentId,
-                order: index
-            }));
-        await put("/primershop-status-manager/statuses/reorder", {
-            statuses: orderedIds
-        });
-        setStatuses(reordered);
-    }, [
-        statuses,
-        put
-    ]);
-    // Setup drag and drop
-    useEffect(()=>{
-        const statusElements = document.querySelectorAll("[data-status-id]");
-        const cleanupFunctions = [];
-        statusElements.forEach((element)=>{
-            const statusId = element.getAttribute("data-status-id");
-            const index = statuses.findIndex((s)=>s.documentId === statusId);
-            const dragHandle = element.querySelector("[data-drag-handle]");
-            if (!dragHandle) return;
-            // Setup draggable
-            const draggableCleanup = draggable({
-                element: dragHandle,
-                getInitialData: ()=>({
-                        statusId,
-                        index,
-                        instanceId
-                    }),
-                onGenerateDragPreview ({ nativeSetDragImage }) {
-                    setCustomNativeDragPreview({
-                        nativeSetDragImage,
-                        getOffset: pointerOutsideOfPreview({
-                            x: "16px",
-                            y: "8px"
-                        }),
-                        render ({ container }) {
-                            const preview = document.createElement("div");
-                            preview.style.padding = "8px 16px";
-                            preview.style.backgroundColor = "#fff";
-                            preview.style.border = "1px solid #ccc";
-                            preview.style.borderRadius = "4px";
-                            preview.style.boxShadow = "0 2px 4px rgba(0,0,0,0.1)";
-                            const statusNameElement = element.querySelector("[data-status-name]");
-                            preview.textContent = statusNameElement?.textContent || "";
-                            container.appendChild(preview);
-                            return ()=>container.removeChild(preview);
-                        }
-                    });
-                }
-            });
-            // Setup drop target
-            const dropTargetCleanup = dropTargetForElements({
-                element: element,
-                canDrop: ({ source })=>source.data.instanceId === instanceId,
-                getData ({ input }) {
-                    return attachClosestEdge({
-                        statusId,
-                        index,
-                        instanceId
-                    }, {
-                        element,
-                        input,
-                        allowedEdges: [
-                            "top",
-                            "bottom"
-                        ]
-                    });
-                },
-                onDrag ({ source, self }) {
-                    const isSource = source.element === dragHandle;
-                    if (isSource) return;
-                    const closestEdge = extractClosestEdge(self.data);
-                    const sourceIndex = Number(source.data.index);
-                    const isItemBeforeSource = index === sourceIndex - 1;
-                    const isItemAfterSource = index === sourceIndex + 1;
-                    const isDropIndicatorHidden = isItemBeforeSource && closestEdge === "bottom" || isItemAfterSource && closestEdge === "top";
-                    if (isDropIndicatorHidden) return;
-                    // Add visual feedback for drop target
-                    element.style.background = `linear-gradient(${closestEdge === "top" ? 180 : 0}deg, rgba(136,131,214,0.4) 0%, rgba(255,255,255,0) 50%)`;
-                },
-                onDragLeave () {
-                    element.style.background = "";
-                },
-                onDrop ({ source, self }) {
-                    element.style.background = "";
-                    const sourceData = source.data;
-                    const targetData = self.data;
-                    const indexOfTarget = statuses.findIndex((s)=>s.documentId === targetData.statusId);
-                    if (indexOfTarget < 0) return;
-                    const closestEdgeOfTarget = extractClosestEdge(targetData);
-                    reorderItem({
-                        startIndex: sourceData.index,
-                        indexOfTarget,
-                        closestEdgeOfTarget
-                    });
-                }
-            });
-            // Combine cleanup functions
-            const combinedCleanup = combine(draggableCleanup, dropTargetCleanup);
-            cleanupFunctions.push(combinedCleanup);
-        });
-        // Monitor for drops
-        const monitorCleanup = monitorForElements({
-            canMonitor: ({ source })=>source.data.instanceId === instanceId,
-            onDrop ({ location, source }) {
-                const target = location.current.dropTargets[0];
-                if (!target) return;
-                const sourceData = source.data;
-                const targetData = target.data;
-                const indexOfTarget = statuses.findIndex((s)=>s.documentId === targetData.statusId);
-                if (indexOfTarget < 0) return;
-                const closestEdgeOfTarget = extractClosestEdge(targetData);
-                reorderItem({
-                    startIndex: sourceData.index,
-                    indexOfTarget,
-                    closestEdgeOfTarget
-                });
-            }
-        });
-        // Cleanup function
-        return ()=>{
-            cleanupFunctions.forEach((cleanup)=>cleanup());
-            monitorCleanup();
-        };
-    }, [
-        statuses,
-        reorderItem,
-        instanceId
-    ]);
-    // Open delete dialog
-    const confirmDelete = (status)=>{
-        setStatusToDelete(status);
-    };
-    // Delete status and replace with selected one
-    const deleteStatus = async ()=>{
-        if (!replacementStatus) return alert("Select a replacement status!");
-        const replacementStatusObj = statuses.find((s)=>s.name === replacementStatus);
-        if (!replacementStatusObj) return alert("Replacement status not found!");
-        try {
-            await put("/primershop-status-manager/statuses/delete", {
-                statusId: statusToDelete?.documentId,
-                replacementId: replacementStatusObj.documentId
-            });
-            // Remove the deleted status from the list
-            setStatuses(statuses.filter((s)=>s.documentId !== statusToDelete?.documentId));
-            setStatusToDelete(null);
-            setReplacementStatus("");
-        } catch (error) {
-            console.error("Error deleting status:", error);
-        }
-    };
-    // Toggle publish status
-    const togglePublish = async (id, published)=>{
-        try {
-            await put(`/primershop-status-manager/statuses/${id}`, {
-                published: !published
-            });
-            setStatuses(statuses.map((s)=>s.documentId === id ? {
-                    ...s,
-                    published: !published
-                } : s));
-        } catch (error) {
-            console.error("Error toggling publish status:", error);
-        }
-    };
-    return /*#__PURE__*/ jsxs(Box, {
-        padding: 4,
-        children: [
-            /*#__PURE__*/ jsx(Typography, {
-                variant: "beta",
-                children: "Status Manager"
-            }),
-            /*#__PURE__*/ jsxs(Flex, {
-                marginTop: 4,
-                gap: 2,
-                children: [
-                    /*#__PURE__*/ jsx(TextInput, {
-                        placeholder: "Enter a status...",
-                        value: newStatus,
-                        onChange: (e)=>setNewStatus(e.target.value)
-                    }),
-                    /*#__PURE__*/ jsx(Button, {
-                        onClick: addStatus,
-                        startIcon: /*#__PURE__*/ jsx(Plus, {}),
-                        children: "Add Status"
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsx(Box, {
-                marginTop: 4,
-                children: statuses.map((status)=>/*#__PURE__*/ jsxs(Flex, {
-                        "data-status-id": status.documentId,
-                        alignItems: "center",
-                        gap: 2,
-                        marginBottom: 2,
-                        paddingBottom: 2,
-                        style: {
-                            borderBottom: `1px solid gray`,
-                            minWidth: 300,
-                            userSelect: "none",
-                            touchAction: "none"
-                        },
-                        children: [
-                            /*#__PURE__*/ jsx(Box, {
-                                "data-drag-handle": true,
-                                style: {
-                                    cursor: "grab",
-                                    padding: "4px",
-                                    display: "flex",
-                                    alignItems: "center"
-                                },
-                                children: /*#__PURE__*/ jsx(Drag, {})
-                            }, `dragHandle-${status.documentId}`),
-                            /*#__PURE__*/ jsx(Typography, {
-                                variant: "sigma",
-                                style: {
-                                    display: "inline-block",
-                                    marginRight: "auto"
-                                },
-                                "data-status-name": true,
-                                children: status.name
-                            }),
-                            /*#__PURE__*/ jsx(Button, {
-                                variant: status.published ? "success-light" : "secondary",
-                                onClick: ()=>togglePublish(status.documentId, status.published),
-                                children: status.published ? "Published" : "Unpublished"
-                            }),
-                            /*#__PURE__*/ jsxs(Dialog.Root, {
-                                onOpenChange: ()=>confirmDelete(status),
-                                children: [
-                                    /*#__PURE__*/ jsx(Dialog.Trigger, {
-                                        children: /*#__PURE__*/ jsx(Button, {
-                                            variant: "tertiary",
-                                            startIcon: /*#__PURE__*/ jsx(Trash, {}),
-                                            children: "Delete"
-                                        })
-                                    }),
-                                    /*#__PURE__*/ jsxs(Dialog.Content, {
-                                        children: [
-                                            /*#__PURE__*/ jsx(Dialog.Header, {
-                                                children: "Delete status"
-                                            }),
-                                            statuses.length > 1 && statusToDelete && /*#__PURE__*/ jsxs(Dialog.Body, {
-                                                children: [
-                                                    /*#__PURE__*/ jsx(Typography, {
-                                                        children: "Choose a replacement status before deleting:"
-                                                    }),
-                                                    /*#__PURE__*/ jsx(SingleSelect, {
-                                                        onChange: (value)=>setReplacementStatus(value),
-                                                        placeholder: "Select replacement",
-                                                        children: statuses.filter((s)=>s.documentId !== statusToDelete.documentId).map((s)=>/*#__PURE__*/ jsx(SingleSelectOption, {
-                                                                value: s.name,
-                                                                children: s.name
-                                                            }, `statusChoice-${s.documentId}`))
-                                                    }),
-                                                    replacementStatus && /*#__PURE__*/ jsxs(Typography, {
-                                                        children: [
-                                                            "Replacing ",
-                                                            statusToDelete.name,
-                                                            " with ",
-                                                            replacementStatus
-                                                        ]
-                                                    })
-                                                ]
-                                            }),
-                                            /*#__PURE__*/ jsxs(Dialog.Footer, {
-                                                children: [
-                                                    /*#__PURE__*/ jsx(Dialog.Cancel, {
-                                                        children: /*#__PURE__*/ jsx(Button, {
-                                                            fullWidth: true,
-                                                            variant: "tertiary",
-                                                            children: "Cancel"
-                                                        })
-                                                    }),
-                                                    /*#__PURE__*/ jsx(Dialog.Action, {
-                                                        children: /*#__PURE__*/ jsx(Button, {
-                                                            fullWidth: true,
-                                                            variant: "danger-light",
-                                                            onClick: deleteStatus,
-                                                            children: "Yes, delete"
-                                                        })
-                                                    })
-                                                ]
-                                            })
-                                        ]
-                                    })
-                                ]
-                            })
-                        ]
-                    }, `status-${status.documentId}`))
-            }, statuses.length)
-        ]
-    });
-};
-
-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

@@ -1,280 +0,0 @@
-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 };