strapi-plugin-navigation 3.0.0-beta.0 → 3.0.0-beta.2

package/admin/pages/HomePage/components/NavigationItemListItem/Wrapper.js

@@ -1,38 +0,0 @@
-import styled from 'styled-components';
-const Wrapper = styled.div `
-  position: relative;
-  margin-top: ${({ theme }) => theme.spaces[2]};
-  margin-left: ${({ level }) => level && '54px'};
-
-  ${({ level, theme, isLast }) => level &&
-    `
-		&::before {
-			${!isLast && 'content: "";'}
-			display: block;
-			top: ${theme.spaces[1]};
-			left: -24px;
-			position: absolute;
-			height: calc(100% + ${theme.spaces[2]});
-			width: 19px;
-			border: 0px solid transparent;
-			border-left: 4px solid ${theme.colors.neutral300};
-		}
-
-		&::after {
-			content: "";
-			display: block;
-			height: 22px;
-			width: 19px;
-			position: absolute;
-			top: ${theme.spaces[1]};
-			left: -${theme.spaces[6]};
-			
-			background: transparent;
-			border: 4px solid ${theme.colors.neutral300};
-			border-top: transparent;
-			border-right: transparent;
-			border-radius: 0 0 0 100%;
-		}
-	`};
-`;
-export default Wrapper;

package/admin/pages/HomePage/components/NavigationItemListItem/index.js

@@ -1,165 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Card, CardBody, Divider, Flex, Link, TextButton, Typography } from '@strapi/design-system';
-import { ArrowRight, Earth, Link as LinkIcon, Plus } from '@strapi/icons';
-import { isEmpty, isNumber } from 'lodash';
-import { useCallback, useEffect, useRef } from 'react';
-import { useDrag, useDrop } from 'react-dnd';
-import { useIntl } from 'react-intl';
-import { useTheme } from 'styled-components';
-import { getTrad } from '../../../../translations';
-import { RELATED_ITEM_SEPARATOR } from '../../../../utils/constants';
-import { useConfig, useContentTypeItems, useContentTypes } from '../../hooks';
-import { extractRelatedItemLabel, mapServerNavigationItem } from '../../utils';
-import { CollapseButton } from '../CollapseButton';
-import { List } from '../NavigationItemList';
-import { ItemCardBadge } from './ItemCardBadge';
-import { ItemCardHeader } from './ItemCardHeader';
-import { ItemCardRemovedOverlay } from './ItemCardRemovedOverlay';
-import Wrapper from './Wrapper';
-export const Item = ({ item, isLast = false, level = 0, levelPath = '', isParentAttachedToMenu, onItemLevelAdd, onItemRemove, onItemRestore, onItemEdit, onItemReOrder, onItemToggleCollapse, displayChildren, permissions, structureId, viewParentId, }) => {
-    const { viewId, type, path, removed, externalPath, menuAttached, collapsed, items = [], isSearchActive, related, relatedType, } = mapServerNavigationItem(item, true);
-    const { formatMessage } = useIntl();
-    const configQuery = useConfig();
-    const isExternal = type === 'EXTERNAL';
-    // TODO: is handled by publish flow
-    const isHandledByPublishFlow = true;
-    const isNextMenuAllowedLevel = isNumber(configQuery.data?.allowedLevels)
-        ? level < configQuery.data.allowedLevels - 1
-        : true;
-    const isMenuAllowedLevel = isNumber(configQuery.data?.allowedLevels)
-        ? level < configQuery.data.allowedLevels
-        : true;
-    const hasChildren = !isEmpty(item.items) && !isExternal && !displayChildren;
-    const absolutePath = isExternal
-        ? undefined
-        : `${levelPath === '/' ? '' : levelPath}/${path === '/' ? '' : path}`;
-    const contentTypeItemsQuery = useContentTypeItems({
-        uid: relatedType ?? '',
-    });
-    const contentTypesQuery = useContentTypes();
-    const contentType = contentTypesQuery.data?.find((_) => _.uid === relatedType);
-    const relatedItem = contentTypeItemsQuery.data?.find((contentTypeItem) => contentTypeItem.id === related) ?? { id: -1 };
-    const isPublished = !!relatedItem.publishedAt;
-    const relatedItemLabel = !isExternal
-        ? extractRelatedItemLabel(relatedItem, configQuery.data)
-        : '';
-    const relatedTypeLabel = contentType?.info.displayName ?? '';
-    const relatedBadgeColor = isPublished ? 'success' : 'secondary';
-    const canUpdate = permissions.canUpdate;
-    const dragRef = useRef(null);
-    const dropRef = useRef(null);
-    const previewRef = useRef(null);
-    const [, drop] = useDrop({
-        accept: `navigation-item_${levelPath}`,
-        hover(hoveringItem, monitor) {
-            const dragIndex = hoveringItem.order ?? 0;
-            const dropIndex = item.order ?? 0;
-            // Don't replace items with themselves
-            if (dragIndex === dropIndex) {
-                return;
-            }
-            const hoverBoundingRect = dropRef.current.getBoundingClientRect();
-            const hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
-            const clientOffset = monitor.getClientOffset();
-            if (!clientOffset) {
-                return;
-            }
-            const hoverClientY = clientOffset.y - hoverBoundingRect.top;
-            // Place the hovering item before or after the drop target
-            const isAfter = hoverClientY > hoverMiddleY;
-            const newOrder = isAfter ? (item.order ?? 0) + 0.5 : (item.order ?? 0) - 0.5;
-            if (dragIndex < dropIndex && hoverClientY < hoverMiddleY) {
-                return;
-            }
-            // Dragging upwards
-            if (dragIndex > dropIndex && hoverClientY > hoverMiddleY) {
-                return;
-            }
-            onItemReOrder({
-                item: mapServerNavigationItem(hoveringItem, true),
-                newOrder,
-            });
-        },
-        collect: (monitor) => ({
-            isOverCurrent: monitor.isOver({ shallow: true }),
-        }),
-    });
-    const [{ isDragging }, drag, dragPreview] = useDrag({
-        type: `navigation-item_${levelPath}`,
-        item: () => item,
-        collect: (monitor) => ({
-            isDragging: monitor.isDragging(),
-        }),
-    });
-    const refs = {
-        dragRef: drag(dragRef),
-        dropRef: drop(dropRef),
-        previewRef: dragPreview(previewRef),
-    };
-    const generatePreviewUrl = (entity) => {
-        const isSingle = contentType?.kind === 'singleType';
-        const entityLocale = entity?.locale ? `?plugins[i18n][locale]=${entity?.locale}` : '';
-        return `/content-manager/${isSingle ? 'single-types' : 'collection-types'}/${contentType?.uid}${!isSingle ? '/' + entity?.id : ''}${entityLocale}`;
-    };
-    const onNewItemClick = useCallback((event) => canUpdate &&
-        onItemLevelAdd(event, viewId, isNextMenuAllowedLevel, absolutePath, menuAttached, `${structureId}.${items.length}`, Math.max(...items.map(({ order }) => order))), [viewId, isNextMenuAllowedLevel, absolutePath, menuAttached, structureId, items, canUpdate]);
-    useEffect(() => {
-        if (isSearchActive) {
-            refs.dropRef?.current?.scrollIntoView?.({
-                behavior: 'smooth',
-                block: 'center',
-                inline: 'center',
-            });
-        }
-    }, [isSearchActive, refs.dropRef.current]);
-    const theme = useTheme();
-    return (_jsxs(Wrapper, { level: level, isLast: isLast, style: { opacity: isDragging ? 0.2 : 1 }, ref: refs ? refs.dropRef : undefined, children: [_jsxs(Card, { style: {
-                    width: '728px',
-                    zIndex: 1,
-                    position: 'relative',
-                    overflow: 'hidden',
-                    backgroundColor: isSearchActive ? theme.colors.neutral150 : undefined,
-                    borderColor: isSearchActive ? theme.colors.neutral300 : undefined,
-                    transition: 'background-color 0.3s ease-in',
-                }, children: [removed && _jsx(ItemCardRemovedOverlay, {}), _jsxs("div", { ref: refs.previewRef, children: [_jsx(CardBody, { children: _jsx(ItemCardHeader, { title: item.title ?? '', path: isExternal ? externalPath : absolutePath, icon: isExternal ? _jsx(Earth, {}) : _jsx(LinkIcon, {}), onItemRemove: () => onItemRemove({ ...item, viewParentId }), onItemEdit: () => {
-                                        const [relatedType, related] = item.related?.split(RELATED_ITEM_SEPARATOR) ?? [];
-                                        if (item.type !== 'EXTERNAL' && item.type !== 'INTERNAL') {
-                                            return;
-                                        }
-                                        onItemEdit({
-                                            item: item.type === 'INTERNAL'
-                                                ? {
-                                                    ...item,
-                                                    type: 'INTERNAL',
-                                                    isMenuAllowedLevel,
-                                                    isParentAttachedToMenu,
-                                                    isSearchActive: false,
-                                                    relatedType,
-                                                    related: related ? parseInt(related, 10) : undefined,
-                                                    additionalFields: item.additionalFields ?? {},
-                                                    items: item.items ?? [],
-                                                    autoSync: item.autoSync ?? true,
-                                                    externalPath: undefined,
-                                                    viewParentId,
-                                                    audience: item.audience?.map(({ id }) => id) ?? [],
-                                                }
-                                                : {
-                                                    ...item,
-                                                    type: 'EXTERNAL',
-                                                    isMenuAllowedLevel,
-                                                    isParentAttachedToMenu,
-                                                    isSearchActive: false,
-                                                    relatedType: undefined,
-                                                    related: undefined,
-                                                    additionalFields: item.additionalFields ?? {},
-                                                    items: item.items ?? [],
-                                                    autoSync: item.autoSync ?? true,
-                                                    externalPath: item.externalPath ?? '',
-                                                    viewParentId,
-                                                    audience: item.audience?.map(({ id }) => id) ?? [],
-                                                },
-                                            levelPath,
-                                            isParentAttachedToMenu,
-                                        });
-                                    }, onItemRestore: () => onItemRestore({ ...item, viewParentId }), dragRef: refs.dragRef, removed: removed, canUpdate: canUpdate, isSearchActive: isSearchActive }) }), _jsx(Divider, {}), !isExternal && (_jsx(CardBody, { style: { padding: '8px' }, children: _jsxs(Flex, { style: { width: '100%' }, direction: "row", alignItems: "center", justifyContent: "space-between", children: [_jsxs(Flex, { children: [!isEmpty(item.items) && (_jsx(CollapseButton, { toggle: () => onItemToggleCollapse({ ...item, viewParentId }), collapsed: collapsed, itemsCount: item.items?.length ?? 0 })), canUpdate && isNextMenuAllowedLevel && (_jsx(TextButton, { disabled: removed, startIcon: _jsx(Plus, {}), onClick: onNewItemClick, children: _jsx(Typography, { variant: "pi", fontWeight: "bold", textColor: removed ? 'neutral600' : 'primary600', children: formatMessage(getTrad('components.navigationItem.action.newItem')) }) }))] }), relatedItemLabel && (_jsxs(Flex, { justifyContent: "center", alignItems: "center", children: [isHandledByPublishFlow && (_jsx(ItemCardBadge, { borderColor: `${relatedBadgeColor}200`, backgroundColor: `${relatedBadgeColor}100`, textColor: `${relatedBadgeColor}600`, className: "action", small: true, children: formatMessage(getTrad(`components.navigationItem.badge.${isPublished ? 'published' : 'draft'}`)) })), _jsxs(Typography, { variant: "omega", textColor: "neutral600", children: [relatedTypeLabel, "\u00A0/\u00A0"] }), _jsx(Typography, { variant: "omega", textColor: "neutral800", children: relatedItemLabel }), _jsx(Link, { to: generatePreviewUrl(relatedItem ?? undefined), endIcon: _jsx(ArrowRight, {}), children: "\u00A0" })] }))] }) }))] })] }), hasChildren && !removed && !collapsed && (_jsx(List, { onItemLevelAdd: onItemLevelAdd, onItemRemove: onItemRemove, onItemEdit: onItemEdit, onItemRestore: onItemRestore, onItemReOrder: onItemReOrder, onItemToggleCollapse: onItemToggleCollapse, isParentAttachedToMenu: menuAttached, items: item.items ?? [], level: level + 1, levelPath: absolutePath, permissions: permissions, structurePrefix: structureId, viewParentId: viewId }))] }));
-};

package/admin/pages/HomePage/components/NavigationItemPopup/NavigationItemPopupFooter.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Modal } from '@strapi/design-system';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../translations';
-export const NavigationItemPopupFooter = ({ handleCancel, handleSubmit, submitDisabled, canUpdate, }) => {
-    const { formatMessage } = useIntl();
-    if (!canUpdate) {
-        return null;
-    }
-    return (_jsxs(Modal.Footer, { children: [_jsx(Modal.Close, { children: _jsx(Button, { onClick: handleCancel, variant: "tertiary", children: formatMessage(getTrad('popup.item.form.button.cancel')) }) }), _jsx(Button, { onClick: handleSubmit, disabled: submitDisabled, children: formatMessage(getTrad('popup.item.form.button.save')) })] }));
-};

package/admin/pages/HomePage/components/NavigationItemPopup/NavigationItemPopupHeader.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Modal, Typography } from '@strapi/design-system';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../translations';
-export const NavigationItemPopupHeader = ({ isNewItem, canUpdate, }) => {
-    const { formatMessage } = useIntl();
-    let modalType = 'view';
-    if (canUpdate) {
-        modalType = isNewItem ? 'new' : 'edit';
-    }
-    return (_jsx(Modal.Header, { children: _jsx(Typography, { variant: "omega", fontWeight: "bold", textColor: "neutral800", as: "h2", id: "asset-dialog-title", children: formatMessage(getTrad(`popup.item.header.${modalType}`)) }) }));
-};

package/admin/pages/HomePage/components/NavigationItemPopup/index.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Modal } from '@strapi/design-system';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../translations';
-import { isRelationPublished } from '../../utils';
-import { NavigationItemForm } from '../NavigationItemForm';
-import { NavigationItemPopupHeader } from './NavigationItemPopupHeader';
-const NavigationItemPopUp = ({ availableLocale, isOpen, isLoading, currentItem = {}, onSubmit, onClose, locale, permissions, currentNavigation, }) => {
-    const { formatMessage } = useIntl();
-    const handleOnSubmit = (payload) => {
-        onSubmit(payload);
-    };
-    const appendLabelPublicationStatus = (label, item, isCollection) => {
-        const appendix = isRelationPublished({
-            relatedRef: item,
-            type: item.isSingle ? 'INTERNAL' : item.type,
-            isCollection,
-        })
-            ? ''
-            : `[${formatMessage(getTrad('notification.navigation.item.relation.status.draft'))}] `.toUpperCase();
-        return `${appendix}${label}`;
-    };
-    const hasViewId = !!currentItem.viewId;
-    return (_jsx(Modal.Root, { labelledBy: "condition-modal-breadcrumbs", onOpenChange: (isOpen) => {
-            if (!isOpen) {
-                onClose({
-                    preventDefault() { },
-                    stopPropagation() { },
-                    target: {},
-                });
-            }
-        }, open: isOpen, children: _jsxs(Modal.Content, { children: [_jsx(NavigationItemPopupHeader, { isNewItem: !hasViewId, canUpdate: permissions?.canUpdate }), _jsx(NavigationItemForm, { availableLocale: availableLocale, current: currentItem, isLoading: isLoading, onSubmit: handleOnSubmit, onCancel: onClose, appendLabelPublicationStatus: appendLabelPublicationStatus, locale: locale, permissions: permissions, currentNavigation: currentNavigation })] }) }));
-};
-export default NavigationItemPopUp;

package/admin/pages/HomePage/components/NavigationManager/AllNavigations/icons.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Pencil, Trash, Feather } from "@strapi/icons";
-export const edit = _jsx(Pencil, {});
-export const deleteIcon = _jsx(Trash, {});
-export const featherIcon = _jsx(Feather, {});

package/admin/pages/HomePage/components/NavigationManager/AllNavigations/index.js

@@ -1,79 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Box, Button, Checkbox, Flex, Grid, IconButton, Table, Tbody, Td, Th, Thead, Tr, Typography, } from '@strapi/design-system';
-import { prop } from 'lodash/fp';
-import { useCallback, useMemo } from 'react';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../../translations';
-import { useConfig, useLocale } from '../../../hooks';
-import { FooterBase } from '../Footer';
-import { INITIAL_NAVIGATION } from '../NewNavigation';
-import * as icons from './icons';
-export const AllNavigations = ({ navigations, selected, setState }) => {
-    const configQuery = useConfig();
-    const hasAnySelected = !!selected.length;
-    const { formatMessage } = useIntl();
-    const localeQuery = useLocale();
-    const toggleSelected = useCallback(() => setState({
-        navigations,
-        selected: hasAnySelected ? [] : navigations.map((n) => n),
-        view: 'LIST',
-    }), [setState, navigations, hasAnySelected]);
-    const currentlySelectedSet = useMemo(() => new Set(selected.map(prop('id'))), [selected]);
-    const handleSelect = (navigation, isSelected) => () => {
-        setState({
-            navigations,
-            selected: isSelected
-                ? selected.filter(({ id }) => id !== navigation.id)
-                : selected.concat([navigation]),
-            view: 'LIST',
-        });
-    };
-    const edit = (navigation) => () => {
-        setState({
-            view: 'EDIT',
-            current: navigation,
-            navigation,
-            alreadyUsedNames: navigations.reduce((acc, { name }) => (name !== navigation.name ? acc.concat([name]) : acc), []),
-        });
-    };
-    const _delete = (navigations) => () => {
-        setState({
-            view: 'DELETE',
-            navigations,
-        });
-    };
-    const purgeCache = (navigations) => () => {
-        setState({
-            view: 'CACHE_PURGE',
-            navigations,
-        });
-    };
-    const deleteSelected = useCallback(_delete(selected), [_delete]);
-    const purgeSelected = useCallback(purgeCache(selected), [purgeCache]);
-    const getLocalizations = (focused) => [focused].concat(navigations.filter((navigation) => navigation.documentId === focused.documentId && navigation.id !== focused.id));
-    return (_jsxs(_Fragment, { children: [_jsx(Grid.Root, { children: _jsx(Grid.Item, { col: 12, paddingBottom: 3, children: hasAnySelected ? (_jsxs(Flex, { direction: "row", gap: 1, children: [_jsx(Box, { paddingRight: 3, children: formatMessage(getTrad('popup.navigation.manage.table.hasSelected'), {
-                                    count: selected.length,
-                                }) }), _jsx(Button, { onClick: deleteSelected, variant: "tertiary", children: formatMessage(getTrad('popup.navigation.manage.button.delete')) }), configQuery.data?.isCacheEnabled ? (_jsx(Button, { onClick: purgeSelected, variant: "tertiary", children: formatMessage(getTrad('popup.navigation.manage.button.purge')) })) : null] })) : null }) }), _jsxs(Table, { rowCount: navigations.length, colCount: 6, children: [_jsx(Thead, { children: _jsxs(Tr, { children: [_jsx(Th, { children: _jsx(Checkbox, { onCheckedChange: toggleSelected, check: hasAnySelected }) }), _jsx(Th, { children: _jsx(Typography, { textColor: "neutral800", children: formatMessage(getTrad('popup.navigation.manage.table.id')) }) }), _jsx(Th, { children: _jsx(Typography, { textColor: "neutral800", children: formatMessage(getTrad('popup.navigation.manage.table.name')) }) }), _jsx(Th, { children: _jsx(Typography, { textColor: "neutral800", children: formatMessage(getTrad('popup.navigation.manage.table.locale')) }) }), _jsx(Th, { children: _jsx(Typography, { textColor: "neutral800", children: formatMessage(getTrad('popup.navigation.manage.table.visibility')) }) }), _jsx(Th, { children: configQuery.data?.isCacheEnabled ? (_jsx(Flex, { direction: "row", children: _jsx(Box, { paddingLeft: 1, children: _jsx(IconButton, { onClick: purgeCache([]), label: formatMessage(getTrad('popup.navigation.manage.button.purge')), noBorder: true, children: icons.featherIcon }) }) })) : null })] }) }), _jsx(Tbody, { children: navigations
-                            .filter(({ localeCode }) => localeCode === localeQuery.data?.defaultLocale)
-                            .map((navigation) => (_jsxs(Tr, { children: [_jsx(Td, { children: _jsx(Checkbox, { onCheckedChange: handleSelect(navigation, currentlySelectedSet.has(navigation.id)), checked: currentlySelectedSet.has(navigation.id) }) }), _jsx(Td, { children: _jsx(Typography, { textColor: "neutral800", children: navigation.id }) }), _jsx(Td, { children: _jsx(Typography, { textColor: "neutral800", children: navigation.name }) }), _jsx(Td, { children: _jsx(Typography, { textColor: "neutral800", children: getLocalizations(navigation).map(prop('localeCode')).join(', ') }) }), _jsx(Td, { children: _jsx(Typography, { textColor: "neutral800", children: navigation.visible
-                                            ? formatMessage(getTrad('popup.navigation.manage.navigation.visible'))
-                                            : formatMessage(getTrad('popup.navigation.manage.navigation.hidden')) }) }), _jsx(Td, { children: _jsxs(Flex, { width: "100%", direction: "row", alignItems: "center", justifyContent: "flex-end", children: [_jsx(Box, { paddingLeft: 1, children: _jsx(IconButton, { onClick: edit(navigation), label: formatMessage(getTrad('popup.navigation.manage.button.edit')), noBorder: true, children: icons.edit }) }), _jsx(Box, { paddingLeft: 1, children: _jsx(IconButton, { onClick: _delete([navigation]), label: formatMessage(getTrad('popup.navigation.manage.button.delete')), noBorder: true, children: icons.deleteIcon }) }), configQuery.data?.isCacheEnabled ? (_jsx(Box, { paddingLeft: 1, children: _jsx(IconButton, { onClick: purgeCache([navigation]), label: formatMessage(getTrad('popup.navigation.manage.button.purge')), noBorder: true, children: icons.featherIcon }) })) : null] }) })] }, navigation.id))) })] })] }));
-};
-export const AllNavigationsFooter = ({ onClose, state, setState, navigations, isLoading, }) => {
-    const { formatMessage } = useIntl();
-    return (_jsx(FooterBase, { start: {
-            onClick: onClose,
-            variant: 'tertiary',
-            disabled: isLoading,
-            children: formatMessage(getTrad('popup.item.form.button.cancel')),
-        }, end: {
-            onClick: () => setState({
-                view: 'CREATE',
-                alreadyUsedNames: navigations.map(({ name }) => name),
-                current: INITIAL_NAVIGATION,
-            }),
-            variant: 'default',
-            disabled: isLoading,
-            children: formatMessage(getTrad('popup.navigation.manage.button.create')),
-        } }));
-};

package/admin/pages/HomePage/components/NavigationManager/DeletionConfirm/index.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Flex, Grid, Typography } from '@strapi/design-system';
-import { prop } from 'lodash/fp';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../../translations';
-import { FooterBase } from '../Footer';
-export const DeletionConfirm = ({ navigations }) => {
-    const { formatMessage } = useIntl();
-    return (_jsxs(Grid.Root, { children: [_jsx(Grid.Item, { col: 12, paddingBottom: 1, children: _jsx(Flex, { children: _jsx(Typography, { variant: "beta", children: formatMessage(getTrad('popup.navigation.manage.delete.header')) }) }) }), _jsx(Grid.Item, { col: 12, paddingBottom: 1, children: _jsx(Typography, { variant: "omega", fontWeight: "semiBold", children: renderItems(navigations) }) })] }));
-};
-export const DeleteConfirmFooter = ({ state, onSubmit, onReset, isLoading }) => {
-    const { formatMessage } = useIntl();
-    return (_jsx(FooterBase, { start: {
-            children: formatMessage(getTrad('popup.item.form.button.cancel')),
-            disabled: isLoading,
-            onClick: onReset,
-            variant: 'tertiary',
-        }, end: {
-            children: formatMessage(getTrad('popup.navigation.manage.button.delete')),
-            disabled: isLoading,
-            onClick: onSubmit,
-            variant: 'danger',
-        } }));
-};
-const renderItems = (navigations) => navigations.map(prop('name')).join(', ');

package/admin/pages/HomePage/components/NavigationManager/ErrorDetails/index.js

@@ -1,29 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Grid } from '@strapi/design-system';
-import { useNotification } from '@strapi/strapi/admin';
-import { useEffect } from 'react';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../../translations';
-import { FooterBase } from '../Footer';
-export const ErrorDetails = ({ errors }) => {
-    const { formatMessage } = useIntl();
-    const { toggleNotification } = useNotification();
-    useEffect(() => {
-        errors.map((error) => {
-            toggleNotification({
-                type: 'warning',
-                message: formatMessage({ id: '', defaultMessage: error.message }),
-            });
-            console.error(error);
-        });
-    }, []);
-    return (_jsx(Grid.Root, { children: _jsx(Grid.Item, { col: 12, children: formatMessage(getTrad('popup.navigation.manage.error.message')) }) }));
-};
-export const ErrorDetailsFooter = ({ onReset }) => {
-    const { formatMessage } = useIntl();
-    return (_jsx(FooterBase, { end: {
-            children: formatMessage(getTrad('popup.navigation.manage.button.goBack')),
-            onClick: onReset,
-            variant: 'secondary',
-        } }));
-};

package/admin/pages/HomePage/components/NavigationManager/Footer/index.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Modal } from '@strapi/design-system';
-export const FooterBase = ({ start, end }) => {
-    return (_jsxs(Modal.Footer, { children: [_jsx(Modal.Close, { children: renderActions(start) }), renderActions(end)] }));
-};
-const renderActions = (actions) => actions ? (_jsx(Button, { onClick: actions.onClick, variant: actions.variant, disabled: actions.disabled, children: actions.children })) : null;

package/admin/pages/HomePage/components/NavigationManager/Form/hooks.js

@@ -1,19 +0,0 @@
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useForm } from 'react-hook-form';
-import { z } from 'zod';
-const formSchema = ({ alreadyUsedNames }) => z.object({
-    name: z
-        .string()
-        .min(2)
-        .and(z.string().refine((name) => !alreadyUsedNames.includes(name), 'name already used')),
-    visible: z.boolean(),
-});
-export const useNavigationForm = ({ alreadyUsedNames, navigation: { name, visible }, }) => {
-    return useForm({
-        resolver: zodResolver(formSchema({ alreadyUsedNames })),
-        defaultValues: {
-            name: name ?? '',
-            visible: visible ?? false,
-        },
-    });
-};

package/admin/pages/HomePage/components/NavigationManager/Form/index.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Field } from '@strapi/design-system';
-import { debounce } from 'lodash';
-import { useEffect } from 'react';
-import { Controller } from 'react-hook-form';
-import { useIntl } from 'react-intl';
-import { Checkbox, Grid } from '@strapi/design-system';
-import { getTrad } from '../../../../../translations';
-import { useNavigationForm } from './hooks';
-import { TextInput } from '@strapi/design-system';
-export const Form = ({ navigation, onChange, alreadyUsedNames = [], isLoading, }) => {
-    const { control, watch } = useNavigationForm({ alreadyUsedNames, navigation });
-    const [name, visible] = watch(['name', 'visible']);
-    const onChangeLimited = debounce(onChange, 300);
-    const { formatMessage } = useIntl();
-    useEffect(() => {
-        if (`${name}-${visible}` !== `${navigation.name}-${navigation.visible}`) {
-            onChangeLimited({
-                ...navigation,
-                name,
-                visible,
-            });
-        }
-    }, [name, visible, navigation]);
-    return (_jsxs(Grid.Root, { gap: 5, children: [_jsx(Grid.Item, { col: 6, children: _jsx(Controller, { control: control, name: "name", render: ({ field: { value, onChange }, fieldState }) => (_jsxs(Field.Root, { width: "100%", error: fieldState.error?.message, children: [_jsx(Field.Label, { children: formatMessage(getTrad('popup.navigation.form.name.label', 'Name')) }), _jsx(TextInput, { name: "name", type: "string", placeholder: formatMessage(getTrad('popup.navigation.form.name.placeholder', "Navigations's name")), onChange: onChange, value: value, disabled: isLoading }), _jsx(Field.Error, {})] })) }) }), _jsx(Grid.Item, { col: 6, children: _jsx(Controller, { control: control, name: "visible", render: ({ field: { onChange, value }, fieldState }) => (_jsxs(Field.Root, { error: fieldState.error?.message, children: [_jsx(Field.Label, { children: formatMessage(getTrad('popup.navigation.form.visible.label', 'Visibility')) }), _jsx(Checkbox, { name: "visible", checked: value, onCheckedChange: onChange, disabled: isLoading }), _jsx(Field.Hint, { children: formatMessage(getTrad('popup.item.form.visible.label')) }), _jsx(Field.Error, {})] })) }) })] }));
-};

package/admin/pages/HomePage/components/NavigationManager/NavigationUpdate/index.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useMemo } from 'react';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../../translations';
-import { FooterBase } from '../Footer';
-import { Form } from '../Form';
-export const NavigationUpdate = ({ alreadyUsedNames, current, isLoading, navigation: initialValue, setState, }) => {
-    const navigation = useMemo(() => current ?? initialValue, [current]);
-    const onChange = useCallback((updated) => {
-        setState({
-            view: 'EDIT',
-            alreadyUsedNames,
-            current: updated,
-            navigation: initialValue,
-        });
-    }, [setState, initialValue, alreadyUsedNames]);
-    return (_jsx(Form, { navigation: navigation, onChange: onChange, isLoading: isLoading, alreadyUsedNames: alreadyUsedNames }));
-};
-export const NavigationUpdateFooter = ({ onSubmit, onReset, isLoading }) => {
-    const { formatMessage } = useIntl();
-    return (_jsx(FooterBase, { start: {
-            children: formatMessage(getTrad('popup.item.form.button.cancel')),
-            disabled: isLoading,
-            onClick: onReset,
-            variant: 'tertiary',
-        }, end: {
-            children: formatMessage(getTrad('popup.navigation.manage.button.save')),
-            disabled: isLoading,
-            onClick: onSubmit,
-            variant: 'secondary',
-        } }));
-};

package/admin/pages/HomePage/components/NavigationManager/NewNavigation/index.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../../translations';
-import { FooterBase } from '../Footer';
-import { Form } from '../Form';
-export const INITIAL_NAVIGATION = {
-    name: 'Navigation',
-    items: [],
-    visible: true,
-};
-export const NewNavigation = ({ setState, current, isLoading, alreadyUsedNames }) => {
-    const onSubmit = useCallback((updated) => {
-        setState({
-            view: 'CREATE',
-            current: updated,
-            alreadyUsedNames,
-        });
-    }, [setState]);
-    return (_jsx(Form, { alreadyUsedNames: alreadyUsedNames, navigation: current, onChange: onSubmit, isLoading: isLoading }));
-};
-export const NewNavigationFooter = ({ onSubmit, onReset, isLoading }) => {
-    const { formatMessage } = useIntl();
-    return (_jsx(FooterBase, { start: {
-            children: formatMessage(getTrad('popup.item.form.button.cancel')),
-            variant: 'tertiary',
-            disabled: isLoading,
-            onClick: onReset,
-        }, end: {
-            children: formatMessage(getTrad('popup.navigation.manage.button.save')),
-            variant: 'default',
-            disabled: isLoading,
-            onClick: onSubmit,
-        } }));
-};

package/admin/pages/HomePage/components/NavigationManager/PurgeCacheConfirm/index.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Flex, Grid, Typography } from '@strapi/design-system';
-import { prop } from 'lodash/fp';
-import { useIntl } from 'react-intl';
-import { getTrad } from '../../../../../translations';
-import { FooterBase } from '../Footer';
-export const PurgeCacheConfirm = ({ navigations }) => {
-    const { formatMessage } = useIntl();
-    return (_jsxs(Grid.Root, { children: [_jsx(Grid.Item, { col: 12, paddingBottom: 1, children: _jsx(Flex, { children: _jsx(Typography, { variant: "beta", children: formatMessage(getTrad('popup.navigation.manage.purge.header')) }) }) }), _jsx(Grid.Item, { col: 12, paddingBottom: 1, children: _jsx(Typography, { variant: "omega", fontWeight: "semiBold", children: renderItems(navigations) }) })] }));
-};
-export const PurgeCacheConfirmFooter = ({ onSubmit, onReset, isLoading }) => {
-    const { formatMessage } = useIntl();
-    return (_jsx(FooterBase, { start: {
-            children: formatMessage(getTrad('popup.item.form.button.cancel')),
-            disabled: isLoading,
-            onClick: onReset,
-            variant: 'tertiary',
-        }, end: {
-            children: formatMessage(getTrad('popup.navigation.manage.footer.button.purge')),
-            disabled: isLoading,
-            onClick: onSubmit,
-            variant: 'danger',
-        } }));
-};
-const renderItems = (navigations) => navigations.map(prop('name')).join(', ');