Admin plugins

// @orthacms/bootstrap-admin
type AdminPlugin = {
    name: string;
    routes?: RouteItem[];   // { path, element, public? } — top-level routes
    layout?: ReactNode;     // the shell's; don't contribute one
    slots?: SlotContribution[];
};

// packages/reviews/admin/src/lib/reviewsPlugin.tsx
import { Suspense } from 'react';
import { MessageSquare } from 'lucide-react';
import type { AdminPlugin } from '@orthacms/bootstrap-admin';
import { ENTRY_SIDEBAR_WIDGET_SLOT } from '@orthacms/content-admin';
import { Spinner } from '@orthacms/design-system';
import { lazyPage } from '@orthacms/utils-admin';
import { WORKSPACE_NAV_SLOT, WORKSPACE_ROUTE_SLOT } from '@orthacms/workspaces-admin';
import { EntryReviewsWidget } from './EntryReviewsWidget';

// Code-split: a page nobody opens is not in the initial bundle. lazyPage
// (0.11.0) also preloads it once the admin is idle, and renders it without
// suspending once it has arrived — so a first visit shows no skeleton.
const ReviewsPage = lazyPage(() => import('./ReviewsPage'), 'ReviewsPage');

export function ReviewsPlugin(): AdminPlugin {
    return {
        name: 'reviews',
        slots: [
            {
                slot: WORKSPACE_ROUTE_SLOT,
                items: [
                    {
                        path: 'reviews', // relative to /workspaces/:id
                        order: 70,
                        element: (
                            <Suspense fallback={<Spinner />}>
                                <ReviewsPage />
                            </Suspense>
                        )
                    }
                ]
            },
            {
                slot: WORKSPACE_NAV_SLOT,
                items: [
                    {
                        labelId: 'reviews.nav.label',
                        defaultLabel: 'Reviews',
                        to: 'reviews', // relative too — never spell out the id
                        order: 45,
                        icon: MessageSquare,
                        permission: 'content:read'
                    }
                ]
            },
            {
                slot: ENTRY_SIDEBAR_WIDGET_SLOT,
                items: [{ id: 'reviews.entry.widget', Component: EntryReviewsWidget }]
            }
        ]
    };
}

// infrastructure/reviewsKeys.ts — one key factory, so invalidation isn't guesswork
export const reviewsKeys = {
    all: (workspaceId: string) => ['reviews', workspaceId] as const,
    byEntry: (workspaceId: string, entryId: string) =>
        ['reviews', workspaceId, 'entry', entryId] as const
};

// infrastructure/httpReviewsGateway.ts — the only file that touches HTTP
import { apiClient } from '@orthacms/utils-admin';
import { toReview, type Review, type ReviewResponse } from './reviewMapper';

export const httpReviewsGateway = {
    async listForEntry(entryId: string): Promise<Review[]> {
        // apiClient: baseURL /api, cookie included, X-Workspace-Id attached
        // (since 0.12.0 a request that sets X-Workspace-Id itself keeps it)
        const { data } = await apiClient.get<ReviewResponse[]>('/reviews', {
            params: { entryId }
        });
        return data.map(toReview);
    },
    async create(entryId: string, body: string): Promise<Review> {
        const { data } = await apiClient.post<ReviewResponse>('/reviews', { entryId, body });
        return toReview(data);
    }
};

// application/useEntryReviews.ts
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
import { useCurrentWorkspace } from '@orthacms/workspaces-admin';
import { httpReviewsGateway } from '../infrastructure/httpReviewsGateway';
import { reviewsKeys } from '../infrastructure/reviewsKeys';

export function useEntryReviews(entryId: string | undefined) {
    const workspace = useCurrentWorkspace();
    return useQuery({
        queryKey: reviewsKeys.byEntry(workspace.id, entryId ?? ''),
        queryFn: () => httpReviewsGateway.listForEntry(entryId as string),
        enabled: !!entryId
    });
}

export function useCreateReview(entryId: string) {
    const workspace = useCurrentWorkspace();
    const queryClient = useQueryClient();
    return useMutation({
        mutationFn: (body: string) => httpReviewsGateway.create(entryId, body),
        onSuccess: () =>
            queryClient.invalidateQueries({ queryKey: reviewsKeys.byEntry(workspace.id, entryId) })
    });
}

// presentation/EntryReviewsWidget.tsx
import { defineMessages, useIntl } from 'react-intl';
import { EntrySidebarSection, type EntrySlotContext } from '@orthacms/content-admin';
import { Spinner } from '@orthacms/design-system';
import { useHasPermission } from '@orthacms/identity-admin';
import { useEntryReviews } from '../application/useEntryReviews';

const messages = defineMessages({
    title: { id: 'reviews.widget.title', defaultMessage: 'Reviews' },
    failed: { id: 'reviews.widget.failed', defaultMessage: 'Reviews could not be loaded.' },
    empty: { id: 'reviews.widget.empty', defaultMessage: 'No reviews yet.' }
});

export function EntryReviewsWidget({ entry, isCreate }: EntrySlotContext) {
    const intl = useIntl();
    const canRead = useHasPermission('content:read');
    const { data, isPending, isError } = useEntryReviews(isCreate ? undefined : entry?.id);

    if (!canRead || isCreate || !entry) return null;

    return (
        <EntrySidebarSection title={intl.formatMessage(messages.title)}>
            {isPending ? <Spinner /> : null}
            {/* Error and empty are different states — never render one as the other */}
            {isError ? <p>{intl.formatMessage(messages.failed)}</p> : null}
            {data?.length === 0 ? <p>{intl.formatMessage(messages.empty)}</p> : null}
            {data?.map((review) => <p key={review.id}>{review.body}</p>)}
        </EntrySidebarSection>
    );
}

import { useHasPermission } from '@orthacms/identity-admin';

const canPublish = useHasPermission('content:publish'); // fail-closed while loading