Compare commits

..
Author SHA1 Message Date
Salihu 4a412899e8 scheduled cleanup 2026-08-14 23:14:02 +01:00
Salihu fd81cd281f page analytics retention 2026-08-14 23:12:36 +01:00
Salihu e204184ad8 fix naming conflicts 2026-08-14 16:20:18 +01:00
Salihu 19e2e8ba1c fix naming conflicts 2026-08-14 16:19:12 +01:00
Salihu 79bf2c3cd7 fix issues 2026-08-13 23:43:09 +01:00
Salihu 76ca723d90 chore: update EE submodule 2026-08-13 22:32:21 +01:00
Salihu 734f59967e page analytics init 2026-08-13 22:25:08 +01:00
Philip Okugbe 89378ee766 chore: package updates (#2378)
* chore: package updates

* remove stale overrides
2026-08-06 23:41:36 +01:00
Philip Okugbe 56ac42767a fix: stale placeholder decorations on empty paragraphs (#2374) 2026-08-02 21:07:50 +01:00
48 changed files with 2256 additions and 2623 deletions
+2 -2
View File
@@ -61,7 +61,7 @@
"react-error-boundary": "6.1.1",
"react-helmet-async": "3.0.0",
"react-i18next": "16.5.8",
"react-router-dom": "7.18.0",
"react-router-dom": "7.18.2",
"semver": "7.7.4",
"socket.io-client": "4.8.3",
"zod": "4.3.6"
@@ -86,7 +86,7 @@
"globals": "15.13.0",
"jsdom": "25.0.0",
"optics-ts": "2.4.1",
"postcss": "8.5.14",
"postcss": "8.5.25",
"postcss-preset-mantine": "1.18.0",
"postcss-simple-vars": "7.0.1",
"prettier": "3.8.1",
+2
View File
@@ -40,6 +40,7 @@ import WorkspaceApiKeys from "@/ee/api-key/pages/workspace-api-keys";
import AiSettings from "@/ee/ai/pages/ai-settings.tsx";
import BasePage from "@/ee/base/pages/base-page.tsx";
import AuditLogs from "@/ee/audit/pages/audit-logs.tsx";
import PageAnalytics from "@/ee/page-analytics/pages/page-analytics.tsx";
import VerifiedPages from "@/ee/page-verification/pages/verified-pages.tsx";
import TemplateList from "@/ee/template/pages/template-list";
import TemplateEditor from "@/ee/template/pages/template-editor";
@@ -127,6 +128,7 @@ export default function App() {
<Route path={"ai"} element={<AiSettings />} />
<Route path={"ai/mcp"} element={<AiSettings />} />
<Route path={"audit"} element={<AuditLogs />} />
<Route path={"analytics"} element={<PageAnalytics />} />
<Route path={"verifications"} element={<VerifiedPages />} />
{!isCloud() && <Route path={"license"} element={<License />} />}
{isCloud() && <Route path={"billing"} element={<Billing />} />}
@@ -5,7 +5,7 @@ import {
} from "@/ee/billing/services/billing-service.ts";
import { getSpaces } from "@/features/space/services/space-service.ts";
import { getGroups } from "@/features/group/services/group-service.ts";
import { QueryParams } from "@/lib/types.ts";
import type { QueryParams } from "@/lib/types.ts";
import { getWorkspaceMembers } from "@/features/workspace/services/workspace-service.ts";
import { getLicenseInfo } from "@/ee/licence/services/license-service.ts";
import { getSsoProviders } from "@/ee/security/services/security-service.ts";
@@ -14,6 +14,11 @@ import { getApiKeys } from "@/ee/api-key";
import { getAuditLogs } from "@/ee/audit/services/audit-service";
import { getVerificationList } from "@/ee/page-verification/services/page-verification-service";
import { getScimTokens } from "@/ee/scim/services/scim-token-service";
import {
getWorkspacePageAnalyticsDailyStats,
getWorkspacePageAnalyticsTopPages,
getWorkspacePageAnalyticsTotals,
} from "@/ee/page-analytics/services/page-analytics-service";
export const prefetchWorkspaceMembers = () => {
const params: QueryParams = { limit: 100, query: "" };
@@ -100,6 +105,31 @@ export const prefetchVerifiedPages = () => {
});
};
export const prefetchPageAnalytics = () => {
const dateRange = {
startDate: new Date(Date.now() - 30 * 24 * 60 * 60 * 1000)
.toISOString()
.slice(0, 10),
endDate: new Date().toISOString().slice(0, 10),
};
const listParams = { ...dateRange, cursor: undefined, limit: 10 };
queryClient.prefetchQuery({
queryKey: ["workspace-page-analytics-totals", dateRange],
queryFn: () => getWorkspacePageAnalyticsTotals(dateRange),
});
queryClient.prefetchQuery({
queryKey: ["workspace-page-analytics-top-pages", listParams],
queryFn: () => getWorkspacePageAnalyticsTopPages(listParams),
});
queryClient.prefetchQuery({
queryKey: ["workspace-page-analytics-daily-stats", listParams],
queryFn: () => getWorkspacePageAnalyticsDailyStats(listParams),
});
};
export const prefetchScimTokens = () => {
queryClient.prefetchQuery({
queryKey: ["scim-token-list", { cursor: undefined }],
@@ -15,6 +15,7 @@ import {
IconSparkles,
IconHistory,
IconShieldCheck,
IconChartBar,
} from "@tabler/icons-react";
import { Link, useLocation } from "react-router-dom";
import classes from "./settings.module.css";
@@ -38,6 +39,7 @@ import {
prefetchWorkspaceMembers,
prefetchAuditLogs,
prefetchVerifiedPages,
prefetchPageAnalytics,
} from "@/components/settings/settings-queries.tsx";
import AppVersion from "@/components/settings/app-version.tsx";
import { mobileSidebarAtom } from "@/components/layouts/global/hooks/atoms/sidebar-atom.ts";
@@ -125,6 +127,13 @@ const groupedData: DataGroup[] = [
role: "owner",
env: "selfhosted",
},
{
label: "Page analytics",
icon: IconChartBar,
path: "/settings/analytics",
feature: Feature.PAGE_ANALYTICS,
role: "owner",
},
],
},
{
@@ -225,6 +234,9 @@ export default function SettingsSidebar() {
case "Verified pages":
prefetchHandler = prefetchVerifiedPages;
break;
case "Page analytics":
prefetchHandler = prefetchPageAnalytics;
break;
default:
break;
}
+1 -17
View File
@@ -26,24 +26,8 @@ import { IAuditLogParams } from "@/ee/audit/types/audit.types";
import { eventFilterOptions } from "@/ee/audit/lib/audit-event-labels";
import AuditLogsTable from "@/ee/audit/components/audit-logs-table";
import useUserRole from "@/hooks/use-user-role";
import { daysToRetention, retentionToDays, RetentionUnit } from "@/ee/utils";
type RetentionUnit = "days" | "months" | "years";
function daysToRetention(days: number): { amount: number; unit: RetentionUnit } {
if (days >= 365 && days % 365 === 0) {
return { amount: days / 365, unit: "years" };
}
if (days >= 30 && days % 30 === 0) {
return { amount: days / 30, unit: "months" };
}
return { amount: days, unit: "days" };
}
function retentionToDays(amount: number, unit: RetentionUnit): number {
if (unit === "years") return amount * 365;
if (unit === "months") return amount * 30;
return amount;
}
export default function AuditLogs() {
const { t } = useTranslation();
+1
View File
@@ -15,6 +15,7 @@ export const Feature = {
SCIM: 'scim',
PAGE_VERIFICATION: 'page:verification',
AUDIT_LOGS: 'audit:logs',
PAGE_ANALYTICS: 'analytics:page-analytics',
RETENTION: 'retention',
SHARING_CONTROLS: 'sharing:controls',
TEMPLATES: 'templates',
@@ -0,0 +1,421 @@
import { useCallback, useEffect, useMemo, useState } from "react";
import {
ActionIcon,
Badge,
Button,
Card,
Group,
NumberInput,
Popover,
Select,
SimpleGrid,
Stack,
Table,
Text,
Tooltip,
} from "@mantine/core";
import { Helmet } from "react-helmet-async";
import { useTranslation } from "react-i18next";
import SettingsTitle from "@/components/settings/settings-title";
import { getAppName } from "@/lib/config";
import Paginate from "@/components/common/paginate";
import { useCursorPaginate } from "@/hooks/use-cursor-paginate";
import {
usePageAnalyticsRetentionQuery,
useUpdatePageAnalyticsRetentionMutation,
useWorkspacePageAnalyticsDailyStatsQuery,
useWorkspacePageAnalyticsTopPagesQuery,
useWorkspacePageAnalyticsTotalsQuery,
} from "@/ee/page-analytics/queries/page-analytics-query";
import { Link } from "react-router-dom";
import { formatLocalized, useDateFnsLocale } from "@/lib/date-locale";
import { IconSettings } from "@tabler/icons-react";
import {
daysToRetention,
formatNumber,
retentionToDays,
RetentionUnit,
toISODate,
} from "@/ee/utils";
type RangePreset = "7" | "30" | "90";
const DAILY_PAGE_SIZE = 10;
export default function PageAnalytics() {
const { t } = useTranslation();
const locale = useDateFnsLocale();
const [rangePreset, setRangePreset] = useState<RangePreset>("30");
const [topPagesLimit, setTopPagesLimit] = useState("10");
const [settingsOpen, setSettingsOpen] = useState(false);
const { data: retentionData } = usePageAnalyticsRetentionQuery();
const updateRetention = useUpdatePageAnalyticsRetentionMutation();
const parsed = useMemo(
() => daysToRetention(retentionData?.retentionDays ?? 365),
[retentionData]
);
useEffect(() => {
if (settingsOpen) return;
setRetentionAmount(parsed.amount);
setRetentionUnit(parsed.unit);
}, [parsed]);
const [retentionAmount, setRetentionAmount] = useState<number | string>(
parsed.amount
);
const [retentionUnit, setRetentionUnit] = useState<RetentionUnit>(parsed.unit);
const resetRetentionForm = useCallback(() => {
const { amount, unit } = daysToRetention(retentionData?.retentionDays ?? 365);
setRetentionAmount(amount);
setRetentionUnit(unit);
}, [setRetentionAmount, setRetentionUnit, retentionData]);
const {
cursor: topPagesCursor,
goNext: goNextTopPages,
goPrev: goPrevTopPages,
resetCursor: resetTopPagesCursor,
} = useCursorPaginate();
const {
cursor: dailyCursor,
goNext: goNextDaily,
goPrev: goPrevDaily,
resetCursor: resetDailyCursor,
} = useCursorPaginate();
const dateRange = useMemo(
() => ({
startDate: toISODate(rangePreset),
endDate: new Date().toISOString().slice(0, 10),
}),
[rangePreset]
);
const topPagesParams = useMemo(
() => ({
...dateRange,
cursor: topPagesCursor,
limit: Number(topPagesLimit),
}),
[dateRange, topPagesCursor, topPagesLimit]
);
const formatDate = useCallback(
(value?: Date | string | null) => {
if (!value) return "-";
const date = new Date(value);
if (Number.isNaN(date.getTime())) return "-";
return formatLocalized(date, "MMM dd, yyyy", "PP", locale);
},
[locale]
);
const dailyParams = useMemo(
() => ({
...dateRange,
cursor: dailyCursor,
limit: DAILY_PAGE_SIZE,
}),
[dateRange, dailyCursor]
);
const { data: totalsData } = useWorkspacePageAnalyticsTotalsQuery(dateRange);
const { data: topPagesData, isLoading: isTopPagesLoading } =
useWorkspacePageAnalyticsTopPagesQuery(topPagesParams);
const { data: dailyData, isLoading: isDailyLoading } =
useWorkspacePageAnalyticsDailyStatsQuery(dailyParams);
const handleRangeChange = (value: RangePreset) => {
if (value) {
setRangePreset(value);
resetTopPagesCursor();
resetDailyCursor();
}
};
const handleTopPagesLimitChange = (value: string | null) => {
if (value) {
setTopPagesLimit(value);
resetTopPagesCursor();
}
};
return (
<>
<Helmet>
<title>
{t("Page analytics")} - {getAppName()}
</title>
</Helmet>
<SettingsTitle title={t("Page analytics")} />
<Group justify="space-between" mb="md">
<Select
value={rangePreset}
onChange={handleRangeChange}
data={[
{ value: "7", label: t("Last 7 days") },
{ value: "30", label: t("Last 30 days") },
{ value: "90", label: t("Last 90 days") },
]}
w={160}
size="sm"
allowDeselect={false}
/>
<Popover
position="bottom-end"
shadow="md"
width={260}
withArrow
opened={settingsOpen}
onChange={(opened) => {
if (!opened) resetRetentionForm();
setSettingsOpen(opened);
}}
>
<Popover.Target>
<Tooltip label={t("Audit settings")}>
<ActionIcon
variant="default"
size="input-sm"
ml="auto"
onClick={() => setSettingsOpen((o) => !o)}
>
<IconSettings size={16} />
</ActionIcon>
</Tooltip>
</Popover.Target>
<Popover.Dropdown>
<Text fz="sm" fw={500} mb={4}>
{t("Retention")}
</Text>
<Text fz="xs" c="dimmed" mb="sm">
{t("Logs older than this period are automatically deleted.")}
</Text>
<Group gap="xs" wrap="nowrap" mb="sm">
<NumberInput
value={retentionAmount}
onChange={(val) => setRetentionAmount(val)}
min={1}
hideControls
size="sm"
w={60}
/>
<Select
data={[
{ value: "days", label: t("days") },
{ value: "months", label: t("months") },
{ value: "years", label: t("years") },
]}
value={retentionUnit}
onChange={(value) => {
if (value === "days" || value === "months" || value === "years") {
setRetentionUnit(value);
}
}}
size="sm"
style={{ flex: 1 }}
comboboxProps={{ withinPortal: false }}
/>
</Group>
<Group gap="xs" grow>
<Button
size="xs"
variant="default"
onClick={() => {
resetRetentionForm();
setSettingsOpen(false);
}}
>
{t("Cancel")}
</Button>
<Button
size="xs"
onClick={() => {
const num =
typeof retentionAmount === "number" ? retentionAmount : 1;
const clamped = Math.max(1, num);
setRetentionAmount(clamped);
const days = retentionToDays(clamped, retentionUnit);
if (days !== (retentionData?.retentionDays ?? 365)) {
updateRetention.mutate({
pageAnalyticsRetentionDays: Number(days),
});
}
setSettingsOpen(false);
}}
loading={updateRetention.isPending}
>
{t("Save")}
</Button>
</Group>
</Popover.Dropdown>
</Popover>
</Group>
<SimpleGrid cols={{ base: 1, sm: 2, lg: 4 }} mb="md">
<Card withBorder radius="md" p="md">
<Text size="xs" c="dimmed">
{t("Total views")}
</Text>
<Text fw={700} fz="xl">
{formatNumber(totalsData?.totals.totalViews)}
</Text>
</Card>
<Card withBorder radius="md" p="md">
<Text size="xs" c="dimmed">
{t("Unique visitors")}
</Text>
<Text fw={700} fz="xl">
{formatNumber(totalsData?.totals.uniqueVisitors)}
</Text>
</Card>
<Card withBorder radius="md" p="md">
<Text size="xs" c="dimmed">
{t("Authenticated visitors")}
</Text>
<Text fw={700} fz="xl">
{formatNumber(totalsData?.totals.authenticatedVisitors)}
</Text>
</Card>
<Card withBorder radius="md" p="md">
<Text size="xs" c="dimmed">
{t("Shared-link views")}
</Text>
<Text fw={700} fz="xl">
{formatNumber(totalsData?.totals.sharedViews)}
</Text>
</Card>
</SimpleGrid>
<SimpleGrid cols={{ base: 1, lg: 2 }} spacing="md">
<Card withBorder radius="md" p="md">
<Group justify="space-between" mb="sm">
<Text fw={600}>{t("Top pages")}</Text>
<Group gap="xs">
{isTopPagesLoading && <Badge variant="light">{t("Loading")}</Badge>}
<Select
aria-label={t("Number of top pages")}
data={[
{ value: "10", label: t("Top 10") },
{ value: "20", label: t("Top 20") },
{ value: "50", label: t("Top 50") },
{ value: "100", label: t("Top 100") },
]}
value={topPagesLimit}
onChange={handleTopPagesLimitChange}
w={100}
size="xs"
allowDeselect={false}
/>
</Group>
</Group>
<Table striped highlightOnHover withTableBorder withColumnBorders>
<Table.Thead>
<Table.Tr>
<Table.Th>{t("Page")}</Table.Th>
<Table.Th>{t("Views")}</Table.Th>
<Table.Th>{t("Visitors")}</Table.Th>
<Table.Th>{t("Last viewed")}</Table.Th>
</Table.Tr>
</Table.Thead>
<Table.Tbody>
{(topPagesData?.items ?? []).map((item) => (
<Table.Tr key={item.pageId}>
<Table.Td>
{item.pageSlugId ? (
<Link to={`/p/${item.pageSlugId}`}>
{item.pageTitle || t("Untitled")}
</Link>
) : (
item.pageTitle || t("Untitled")
)}
</Table.Td>
<Table.Td>{formatNumber(item.totalViews)}</Table.Td>
<Table.Td>{formatNumber(item.uniqueVisitors)}</Table.Td>
<Table.Td>{formatDate(item.lastViewedAt)}</Table.Td>
</Table.Tr>
))}
{!isTopPagesLoading && (topPagesData?.items.length ?? 0) === 0 && (
<Table.Tr>
<Table.Td colSpan={4}>
<Text c="dimmed" size="sm">
{t("No analytics data for this range.")}
</Text>
</Table.Td>
</Table.Tr>
)}
</Table.Tbody>
</Table>
{topPagesData?.items &&
topPagesData.items.length > 0 &&
(topPagesData.meta.hasPrevPage || topPagesData.meta.hasNextPage) && (
<Paginate
hasPrevPage={topPagesData.meta.hasPrevPage}
hasNextPage={topPagesData.meta.hasNextPage}
onPrev={goPrevTopPages}
onNext={() => goNextTopPages(topPagesData.meta.nextCursor)}
/>
)}
</Card>
<Card withBorder radius="md" p="md">
<Group justify="space-between" mb="sm">
<Text fw={600}>{t("Daily breakdown")}</Text>
{isDailyLoading && <Badge variant="light">{t("Loading")}</Badge>}
</Group>
<Stack gap="xs">
<Table striped highlightOnHover withTableBorder withColumnBorders>
<Table.Thead>
<Table.Tr>
<Table.Th>{t("Date")}</Table.Th>
<Table.Th>{t("Views")}</Table.Th>
<Table.Th>{t("Visitors")}</Table.Th>
</Table.Tr>
</Table.Thead>
<Table.Tbody>
{(dailyData?.items ?? []).map((item) => (
<Table.Tr key={item.viewDate}>
<Table.Td>{item.viewDate}</Table.Td>
<Table.Td>{formatNumber(item.totalViews)}</Table.Td>
<Table.Td>{formatNumber(item.uniqueVisitors)}</Table.Td>
</Table.Tr>
))}
{!isDailyLoading && (dailyData?.items.length ?? 0) === 0 && (
<Table.Tr>
<Table.Td colSpan={3}>
<Text c="dimmed" size="sm">
{t("No analytics data for this range.")}
</Text>
</Table.Td>
</Table.Tr>
)}
</Table.Tbody>
</Table>
{dailyData?.items &&
dailyData.items.length > 0 &&
(dailyData.meta.hasPrevPage || dailyData.meta.hasNextPage) && (
<Paginate
hasPrevPage={dailyData.meta.hasPrevPage}
hasNextPage={dailyData.meta.hasNextPage}
onPrev={goPrevDaily}
onNext={() => goNextDaily(dailyData.meta.nextCursor)}
/>
)}
</Stack>
</Card>
</SimpleGrid>
</>
);
}
@@ -0,0 +1,73 @@
import { keepPreviousData, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import {
getPageAnalyticsRetention,
getWorkspacePageAnalyticsDailyStats,
getWorkspacePageAnalyticsTopPages,
getWorkspacePageAnalyticsTotals,
updatePageAnalyticsRetention,
} from "@/ee/page-analytics/services/page-analytics-service";
import type { IPagination } from "@/lib/types";
import type {
WorkspaceAnalyticsDailyStat,
WorkspaceAnalyticsListParams,
WorkspaceAnalyticsParams,
WorkspaceAnalyticsTopPage,
WorkspaceAnalyticsTotals,
} from "@/ee/page-analytics/types/page-analytics.types";
import { useTranslation } from "react-i18next";
import { notifications } from "@mantine/notifications";
export function useWorkspacePageAnalyticsTotalsQuery(
params?: WorkspaceAnalyticsParams,
) {
return useQuery<WorkspaceAnalyticsTotals, Error>({
queryKey: ["workspace-page-analytics-totals", params],
queryFn: () => getWorkspacePageAnalyticsTotals(params),
placeholderData: keepPreviousData,
});
}
export function useWorkspacePageAnalyticsDailyStatsQuery(
params?: WorkspaceAnalyticsListParams,
) {
return useQuery<IPagination<WorkspaceAnalyticsDailyStat>, Error>({
queryKey: ["workspace-page-analytics-daily-stats", params],
queryFn: () => getWorkspacePageAnalyticsDailyStats(params),
placeholderData: keepPreviousData,
});
}
export function useWorkspacePageAnalyticsTopPagesQuery(
params?: WorkspaceAnalyticsListParams,
) {
return useQuery<IPagination<WorkspaceAnalyticsTopPage>, Error>({
queryKey: ["workspace-page-analytics-top-pages", params],
queryFn: () => getWorkspacePageAnalyticsTopPages(params),
placeholderData: keepPreviousData,
});
}
export function usePageAnalyticsRetentionQuery() {
return useQuery({
queryKey: ["page-analytics-retention"],
queryFn: () => getPageAnalyticsRetention(),
});
}
export function useUpdatePageAnalyticsRetentionMutation() {
const queryClient = useQueryClient();
const { t } = useTranslation();
return useMutation({
mutationFn: (data: { pageAnalyticsRetentionDays: number }) =>
updatePageAnalyticsRetention(data),
onSuccess: () => {
notifications.show({ message: t("Page analytics retention updated") });
queryClient.invalidateQueries({ queryKey: ["page-analytics-retention"] });
},
onError: (error) => {
const errorMessage = error["response"]?.data?.message;
notifications.show({ message: errorMessage, color: "red" });
},
});
}
@@ -0,0 +1,43 @@
import api from "@/lib/api-client";
import type { IPagination } from "@/lib/types";
import type {
WorkspaceAnalyticsDailyStat,
WorkspaceAnalyticsListParams,
WorkspaceAnalyticsParams,
WorkspaceAnalyticsTopPage,
WorkspaceAnalyticsTotals,
} from "@/ee/page-analytics/types/page-analytics.types";
export async function getWorkspacePageAnalyticsTotals(
params?: WorkspaceAnalyticsParams,
): Promise<WorkspaceAnalyticsTotals> {
const req = await api.post("/page-analytics/workspace-stats", params);
return req.data;
}
export async function getWorkspacePageAnalyticsDailyStats(
params?: WorkspaceAnalyticsListParams,
): Promise<IPagination<WorkspaceAnalyticsDailyStat>> {
const req = await api.post("/page-analytics/workspace-daily-stats", params);
return req.data;
}
export async function getWorkspacePageAnalyticsTopPages(
params?: WorkspaceAnalyticsListParams,
): Promise<IPagination<WorkspaceAnalyticsTopPage>> {
const req = await api.post("/page-analytics/workspace-top-pages", params);
return req.data;
}
export async function getPageAnalyticsRetention(): Promise<{ retentionDays: number }> {
const req = await api.post("/page-analytics/retention");
return req.data;
}
export async function updatePageAnalyticsRetention(data: {
pageAnalyticsRetentionDays: number;
}): Promise<{ retentionDays: number }> {
const req = await api.post("/page-analytics/retention/update", data);
return req.data;
}
@@ -0,0 +1,32 @@
import { QueryParams } from "@/lib/types";
export type WorkspaceAnalyticsParams = {
startDate?: string;
endDate?: string;
};
export type WorkspaceAnalyticsListParams = WorkspaceAnalyticsParams &
QueryParams;
export type BasicStats = {
totalViews: number;
uniqueVisitors: number;
authenticatedVisitors: number;
sharedViews: number;
};
export type WorkspaceAnalyticsDailyStat = BasicStats & {
viewDate: string;
};
export type WorkspaceAnalyticsTopPage = BasicStats & {
pageId: string;
pageTitle: string | null;
pageSlugId: string | null;
lastViewedAt: string | null;
};
export type WorkspaceAnalyticsTotals = {
range: { startDate: string; endDate: string };
totals: BasicStats;
};
+30
View File
@@ -14,3 +14,33 @@ export function exchangeTokenRedirectUrl(
) {
return getHostnameUrl(hostname) + "/api/auth/exchange?token=" + exchangeToken;
}
export type RetentionUnit = "days" | "months" | "years";
export function daysToRetention(days: number): { amount: number; unit: RetentionUnit } {
if (days >= 365 && days % 365 === 0) {
return { amount: days / 365, unit: "years" };
}
if (days >= 30 && days % 30 === 0) {
return { amount: days / 30, unit: "months" };
}
return { amount: days, unit: "days" };
}
export function retentionToDays(amount: number, unit: RetentionUnit): number {
if (unit === "years") return amount * 365;
if (unit === "months") return amount * 30;
return amount;
}
export function toISODate(daysAgo: number | string): string {
const daysNum = Number(daysAgo);
return new Date(Date.now() - daysNum * 24 * 60 * 60 * 1000)
.toISOString()
.slice(0, 10);
}
export function formatNumber(value: number | null | undefined): string {
return Number(value ?? 0).toLocaleString();
}
@@ -389,14 +389,6 @@ const CommandGroups: SlashMenuGroupedItemsType = {
command: ({ editor, range }: CommandProps) =>
editor.chain().focus().deleteRange(range).setDetails().run(),
},
{
title: "Tabs",
description: "Insert a multi-tab content block.",
searchTerms: ["tabs", "tabbed", "multi", "panel"],
icon: IconSitemap,
command: ({ editor, range }: CommandProps) =>
editor.chain().focus().deleteRange(range).insertTabs().run(),
},
{
title: "Callout",
description: "Insert callout notice.",
@@ -1,167 +0,0 @@
import { BubbleMenu } from "@tiptap/react/menus";
import React, { useCallback } from "react";
import { EditorMenuProps, ShouldShowProps } from "../table/types/types";
import { isEditorReady, isTextSelected } from "@docmost/editor-ext";
import { Node as PMNode } from "@tiptap/pm/model";
import { findParentNode, posToDOMRect } from "@tiptap/core";
import classes from "../common/toolbar-menu.module.css";
import { ActionIcon, Tooltip } from "@mantine/core";
import { useTranslation } from "react-i18next";
import {
IconChevronLeft,
IconChevronRight,
IconColumnInsertLeft,
IconColumnInsertRight,
IconColumnRemove,
IconTrashX,
} from "@tabler/icons-react";
const TabsMenu = React.memo(({ editor }: EditorMenuProps) => {
const { t } = useTranslation();
const shouldShow = useCallback(
({ state }: ShouldShowProps) => {
if (!state) {
return false;
}
if (isTextSelected(editor)) return false;
return editor.isActive("tabs");
},
[editor]
);
const getReferencedVirtualElement = useCallback(() => {
if (!isEditorReady(editor)) return;
const { selection } = editor.state;
const predicate = (node: PMNode) => node.type.name === "tabs";
const parent = findParentNode(predicate)(selection);
if (parent) {
const dom = editor.view.nodeDOM(parent?.pos) as HTMLElement;
const domRect = dom.getBoundingClientRect();
return {
getBoundingClientRect: () => domRect,
getClientRects: () => [domRect],
};
}
const domRect = posToDOMRect(editor.view, selection.from, selection.to);
return {
getBoundingClientRect: () => domRect,
getClientRects: () => [domRect],
};
}, [editor]);
const handleAddTabLeft = useCallback(() => {
editor.chain().focus().insertTab("left").run();
}, [editor]);
const handleAddTabRight = useCallback(() => {
editor.chain().focus().insertTab("right").run();
}, [editor]);
const handleMoveTabRight = useCallback(() => {
editor.chain().focus().moveTab("right").run();
}, [editor]);
const handleMoveTabLeft = useCallback(() => {
editor.chain().focus().moveTab("left").run();
}, [editor]);
const handleDeleteTab = useCallback(() => {
editor.chain().focus().deleteTab().run();
}, [editor]);
const handleDelete = useCallback(() => {
editor.chain().focus().deleteTabs().run();
}, [editor]);
return (
<BubbleMenu
style={{ zIndex: 99 }}
editor={editor}
pluginKey="tabs-menu"
resizeDelay={0}
getReferencedVirtualElement={getReferencedVirtualElement}
shouldShow={shouldShow}
options={{
placement: "top",
offset: false,
flip: false,
}}
>
<div className={classes.toolbar}>
<Tooltip position="top" label={t("Add left tab")} withinPortal={false}>
<ActionIcon
onClick={handleAddTabLeft}
variant="subtle"
size="lg"
aria-label={t("Add left tab")}
>
<IconColumnInsertLeft size={18} />
</ActionIcon>
</Tooltip>
<Tooltip position="top" label={t("Add right tab")} withinPortal={false}>
<ActionIcon
onClick={handleAddTabRight}
variant="subtle"
size="lg"
aria-label={t("Add right tab")}
>
<IconColumnInsertRight size={18} />
</ActionIcon>
</Tooltip>
<Tooltip position="top" label={t("Delete tab")} withinPortal={false}>
<ActionIcon
onClick={handleDeleteTab}
variant="subtle"
size="lg"
aria-label={t("Delete tab")}
>
<IconColumnRemove size={18} />
</ActionIcon>
</Tooltip>
<div className={classes.divider} />
<Tooltip position="top" label={t("Move tab left")} withinPortal={false}>
<ActionIcon
onClick={handleMoveTabLeft}
variant="subtle"
size="lg"
aria-label={t("Move tab left")}
>
<IconChevronLeft size={18} />
</ActionIcon>
</Tooltip>
<Tooltip position="top" label={t("Move tab right")} withinPortal={false}>
<ActionIcon
onClick={handleMoveTabRight}
variant="subtle"
size="lg"
aria-label={t("Move tab right")}
>
<IconChevronRight size={18} />
</ActionIcon>
</Tooltip>
<div className={classes.divider} />
<Tooltip position="top" label={t("Delete")} withinPortal={false}>
<ActionIcon
onClick={handleDelete}
variant="subtle"
size="lg"
aria-label={t("Delete")}
>
<IconTrashX size={18} />
</ActionIcon>
</Tooltip>
</div>
</BubbleMenu>
);
});
export default TabsMenu;
@@ -1,140 +0,0 @@
import React, {
ChangeEvent,
useCallback,
useEffect,
useMemo,
useRef,
useState,
type KeyboardEvent,
} from "react";
import { NodeViewContent, NodeViewWrapper, type NodeViewProps } from "@tiptap/react";
import { Tabs, TextInput } from "@mantine/core";
export default function TabsView(props: NodeViewProps) {
const { node, editor, getPos } = props;
const isEditable = editor.isEditable;
const allowFocusRef = useRef(false);
const tabs = useMemo(() => {
return Array.from({ length: node.childCount }, (_, index) => {
const labelNode = node.child(index)?.child(0);
const labelText = labelNode?.textContent;
const labelId = node.child(index)?.attrs?.id;
return {
label: labelText ?? "",
id: labelId ?? index,
};
});
}, [node]);
const activeTab = clampIndex(node.attrs.activeTab);
const [activeLabel, setActiveLabel] = useState(tabs[activeTab].label ?? "");
useEffect(() => {
setActiveLabel(tabs[activeTab].label);
}, [activeTab, tabs]);
const handleMouseDown = useCallback((event: React.MouseEvent) => {
const previous = document.activeElement as HTMLElement | null;
const input = event.currentTarget;
if (!previous?.contains(input)) {
allowFocusRef.current = true;
return;
}
allowFocusRef.current = true;
}, []);
const handleFocus = useCallback(
(event: React.FocusEvent<HTMLInputElement>) => {
if (!allowFocusRef.current || !isEditable) {
event.preventDefault();
event.target.blur();
}
},
[isEditable]
);
const handleBlur = useCallback(() => {
allowFocusRef.current = false;
}, []);
const commitLabel = useCallback(
(event: ChangeEvent<HTMLInputElement>) => {
const label = event.currentTarget.value;
setActiveLabel(label);
if (label === tabs[activeTab].label) return;
if (typeof getPos === "function") {
editor.commands.updateTabLabel?.(activeTab, label, getPos());
}
},
[activeTab, editor, getPos, tabs]
);
const handleLabelKeyDown = useCallback(
(event: KeyboardEvent<HTMLInputElement>) => {
event.stopPropagation();
if (event.key === "Escape") {
event.preventDefault();
event.currentTarget.blur();
}
},
[]
);
return (
<NodeViewWrapper data-type="tabs">
<Tabs value={String(activeTab)}>
<Tabs.List style={{ marginBottom: 10 }}>
{tabs.map(({ label, id }, index) => (
<Tabs.Tab
key={id}
value={index.toString()}
onFocus={(event) => event.currentTarget.blur()}
onClick={(e) => {
e.preventDefault();
if (typeof getPos === "function") {
editor.commands.setActiveTab?.(index, getPos());
}
}}
>
<TextInput
aria-label="Edit tab label"
onMouseDown={handleMouseDown}
onFocus={handleFocus}
onBlur={handleBlur}
onChange={commitLabel}
onKeyDown={handleLabelKeyDown}
variant="unstyled"
size="xs"
value={
index === activeTab && allowFocusRef.current ? activeLabel : label
}
styles={{
input: {
minWidth: 80,
padding: 0,
cursor: "pointer",
},
}}
/>
</Tabs.Tab>
))}
</Tabs.List>
</Tabs>
<div className="dm-tabs__content">
<NodeViewContent as="div" />
</div>
</NodeViewWrapper>
);
}
const clampIndex = (value: unknown, length = Number.MAX_SAFE_INTEGER) => {
const parsed = Number(value ?? 0);
if (!Number.isFinite(parsed) || length <= 0) return 0;
return Math.max(0, Math.min(Math.trunc(parsed), length - 1));
};
@@ -5,9 +5,8 @@ import {
PluginKey,
TextSelection,
} from "@tiptap/pm/state";
import { Fragment, Slice } from "@tiptap/pm/model";
import type { Node, ResolvedPos } from "@tiptap/pm/model";
import type { EditorView } from "@tiptap/pm/view";
import { Fragment, Slice, Node } from "@tiptap/pm/model";
import { EditorView } from "@tiptap/pm/view";
export interface GlobalDragHandleOptions {
/**
@@ -151,126 +150,9 @@ function isCustomNodeDOM(
return false;
}
function getDirectTarget($pos: ResolvedPos, ancestorDepth: number) {
const ancestor = $pos.node(ancestorDepth);
if (ancestor.childCount === 0) return null;
if ($pos.depth > ancestorDepth) {
const childDepth = ancestorDepth + 1;
return {
pos: $pos.before(childDepth),
node: $pos.node(childDepth),
};
}
const index = $pos.index(ancestorDepth);
const childIndex = Math.min(index, ancestor.childCount - 1);
if (childIndex < 0) return null;
return {
pos: $pos.posAtIndex(childIndex, ancestorDepth),
node: ancestor.child(childIndex),
};
}
type DragSource = { from: number; to: number; node: Node };
function dragSourceFromDOM(view: EditorView, dom: Element): DragSource | null {
let pos: number;
try {
pos = view.posAtDOM(dom, 0);
} catch {
return null;
}
const $pos = view.state.doc.resolve(pos);
if ($pos.depth === 0) return null;
const from = $pos.before($pos.depth);
const node = $pos.node($pos.depth);
return { from, to: from + node.nodeSize, node };
}
function resolveMoveSource(
view: EditorView,
hint: DragSource | null,
): DragSource | null {
const { state } = view;
if (hint) {
const current = state.doc.nodeAt(hint.from);
if (current?.eq(hint.node)) return hint;
}
if (state.selection instanceof NodeSelection) {
return {
from: state.selection.from,
to: state.selection.from + state.selection.node.nodeSize,
node: state.selection.node,
};
}
return null;
}
function moveNodeWithinTabPanel(
view: EditorView,
dropPos: number,
source: DragSource,
): boolean {
const { state } = view;
const { from: sourceFrom, to: sourceTo, node: sourceNode } = source;
const $drop = state.doc.resolve(dropPos);
const panelDepth = view.state.doc.resolve(dropPos).depth
if (panelDepth < 0) return false;
if (dropPos > sourceFrom && dropPos < sourceTo) return false;
let insertPos: number;
const target = getDirectTarget($drop, panelDepth);
if (!target) {
insertPos = $drop.start(panelDepth);
} else {
const targetStart = target.pos;
const targetEnd = targetStart + target.node.nodeSize;
const midpoint = (targetStart + targetEnd) / 2;
insertPos = dropPos >= midpoint ? targetEnd : targetStart;
}
// Already in place.
if (insertPos === sourceFrom || insertPos === sourceTo) return false;
const tr = state.tr;
tr.delete(sourceFrom, sourceTo);
const insertAt = tr.mapping.map(insertPos, -1);
const $insert = tr.doc.resolve(insertAt);
const index = $insert.index();
if (!$insert.parent.canReplace(index, index, Fragment.from(sourceNode))) {
return false;
}
tr.insert(insertAt, sourceNode);
const $placed = tr.doc.resolve(
Math.min(insertAt, tr.doc.content.size),
);
tr.setSelection(NodeSelection.near($placed));
tr.scrollIntoView();
view.dispatch(tr);
return true;
}
const NON_PROMOTABLE_PARENTS = new Set(["tabs", "tab", "tabPanel"]);
function calcNodePos(pos: number, view: EditorView) {
const $pos = view.state.doc.resolve(pos);
if ($pos.depth > 1 && !NON_PROMOTABLE_PARENTS.has($pos.node($pos.depth).type.name))
return $pos.before($pos.depth);
if ($pos.depth > 1) return $pos.before($pos.depth);
return pos;
}
@@ -278,8 +160,6 @@ export function DragHandlePlugin(
options: GlobalDragHandleOptions & { pluginKey: string },
) {
let listType = "";
let dragSource: DragSource | null = null;
function handleDragStart(event: DragEvent, view: EditorView) {
view.focus();
@@ -296,8 +176,6 @@ export function DragHandlePlugin(
if (!(node instanceof Element)) return;
dragSource = dragSourceFromDOM(view, node);
let draggedNodePos = nodePosAtDOM(node, view, options);
if (draggedNodePos == null || draggedNodePos < 0) return;
draggedNodePos = calcNodePos(draggedNodePos, view);
@@ -523,7 +401,6 @@ export function DragHandlePlugin(
);
const notDragging = node?.closest(".not-draggable");
const notDraggingMatch = node?.matches(".not-draggable-match")
const excludedTagList = options.excludedTags
.concat(["ol", "ul"])
.join(", ");
@@ -531,8 +408,7 @@ export function DragHandlePlugin(
if (
!(node instanceof Element) ||
node.matches(excludedTagList) ||
notDragging ||
notDraggingMatch
notDragging
) {
hideDragHandle();
return;
@@ -620,22 +496,6 @@ export function DragHandlePlugin(
const isDroppedInsideList =
resolvedPos.parent.type.name === "listItem";
const isDroppedInsideTabPanel =
resolvedPos.parent.type.name === "tabPanel";
if (isDroppedInsideTabPanel) {
const source = resolveMoveSource(view, dragSource);
const moved = source
? moveNodeWithinTabPanel(view, dropPos.pos, source)
: false;
// even when not moved swallow the drop so ProseMirror doesn't insert a copy.
event.preventDefault();
view.dragging = null;
dragSource = null;
return moved;
}
// If the selected node is a list item and is not dropped inside a list, we need to wrap it inside <ol> tag otherwise ol list items will be transformed into ul list item when dropped
if (
view.state.selection instanceof NodeSelection &&
@@ -653,7 +513,6 @@ export function DragHandlePlugin(
},
dragend: (view) => {
view.dom.classList.remove("dragging");
dragSource = null;
},
},
},
@@ -667,7 +526,6 @@ const GlobalDragHandle = Extension.create({
return {
dragHandleWidth: 20,
scrollThreshold: 100,
dragHandleSelector: undefined,
excludedTags: [],
customNodes: [],
atomNodes: [],
@@ -3,7 +3,8 @@ import { StarterKit } from "@tiptap/starter-kit";
import { Code } from "@tiptap/extension-code";
import { TextAlign } from "@tiptap/extension-text-align";
import { TaskList, TaskItem } from "@tiptap/extension-list";
import { Placeholder, CharacterCount, UndoRedo } from "@tiptap/extensions";
import { CharacterCount, UndoRedo } from "@tiptap/extensions";
import { Placeholder } from "@/features/editor/extensions/placeholder";
import { Superscript } from "@tiptap/extension-superscript";
import SubScript from "@tiptap/extension-subscript";
import { Typography } from "@tiptap/extension-typography";
@@ -62,10 +63,6 @@ import {
TransclusionReference,
TableView,
BaseEmbed as BaseEmbedNode,
Tabs,
Tab,
TabLabel,
TabPanel,
} from "@docmost/editor-ext";
import {
randomElement,
@@ -94,7 +91,6 @@ import ExcalidrawView from "@/features/editor/components/excalidraw/excalidraw-v
import EmbedView from "@/features/editor/components/embed/embed-view.tsx";
import PdfView from "@/features/editor/components/pdf/pdf-view.tsx";
import SubpagesView from "@/features/editor/components/subpages/subpages-view.tsx";
import TabsView from "@/features/editor/components/tabs/tabs-view.tsx";
import TransclusionView from "@/features/editor/components/transclusion/transclusion-view.tsx";
import TransclusionReferenceView from "@/features/editor/components/transclusion/transclusion-reference-view.tsx";
import { BaseEmbedView } from "@/features/editor/components/base-embed/base-embed-view.tsx";
@@ -239,7 +235,7 @@ export const mainExtensions = [
Typography,
TrailingNode,
GlobalDragHandle.configure({
customNodes: ["transclusionSource", "transclusionReference", "tabPanel"],
customNodes: ["transclusionSource", "transclusionReference"],
atomNodes: ["base"],
}),
TextStyle,
@@ -294,12 +290,6 @@ export const mainExtensions = [
Details,
DetailsSummary,
DetailsContent,
Tabs.configure({
view: TabsView,
}),
Tab,
TabLabel,
TabPanel,
Youtube.configure({
addPasteHandler: false,
controls: true,
@@ -0,0 +1,64 @@
import { isNodeEmpty } from "@tiptap/core";
import { Plugin, PluginKey } from "@tiptap/pm/state";
import { Decoration, DecorationSet } from "@tiptap/pm/view";
import { Placeholder as TiptapPlaceholder } from "@tiptap/extensions";
export const Placeholder = TiptapPlaceholder.extend({
addProseMirrorPlugins() {
const editor = this.editor;
const options = this.options;
const dataAttribute = `data-${options.dataAttribute || "placeholder"}`;
return [
new Plugin({
key: new PluginKey("docmostPlaceholder"),
props: {
decorations: (state) => {
if (options.showOnlyWhenEditable && !editor.isEditable) {
return null;
}
const { doc, selection } = state;
const { anchor } = selection;
const decorations: Decoration[] = [];
const isEmptyDoc = editor.isEmpty;
doc.descendants((node, pos) => {
if (!node.type.isTextblock) {
return options.includeChildren;
}
const hasAnchor = anchor >= pos && anchor <= pos + node.nodeSize;
const isEmpty = !node.isLeaf && isNodeEmpty(node);
if ((hasAnchor || !options.showOnlyCurrent) && isEmpty) {
const emptyNodeClass =
typeof options.emptyNodeClass === "function"
? options.emptyNodeClass({ editor, node, pos, hasAnchor })
: options.emptyNodeClass;
const classes = [emptyNodeClass];
if (isEmptyDoc) {
classes.push(options.emptyEditorClass);
}
decorations.push(
Decoration.node(pos, pos + node.nodeSize, {
class: classes.join(" "),
[dataAttribute]:
typeof options.placeholder === "function"
? options.placeholder({ editor, node, pos, hasAnchor })
: options.placeholder,
}),
);
}
return options.includeChildren;
});
return DecorationSet.create(doc, decorations);
},
},
}),
];
},
});
@@ -82,7 +82,6 @@ import {
getCollabSocket,
releaseCollabSocket,
} from "@/features/editor/collab-socket";
import TabsMenu from "./components/tabs/tabs-menu";
interface PageEditorProps {
pageId: string;
@@ -454,7 +453,6 @@ function CollabPageEditor({
<ExcalidrawMenu editor={editor} />
<DrawioMenu editor={editor} />
<ColumnsMenu editor={editor} />
<TabsMenu editor={editor} />
</div>
)}
{editor && !editorIsEditable && (editable || canComment) && (
@@ -17,5 +17,4 @@
@import "./indent.css";
@import "./columns.css";
@import "./status.css";
@import "./tabs.css";
@import "./base-embed.css";
@@ -1,15 +0,0 @@
.ProseMirror {
[data-type="tabs"] {
button {
outline: none;
}
}
[data-type="tabLabel"] {
display: none;
}
[data-type="tabPanel"] {
outline: none;
}
}
+7 -7
View File
@@ -40,14 +40,14 @@
"@clickhouse/client": "1.18.2",
"@docmost/base-formula": "workspace:*",
"@docmost/pdf-inspector": "1.9.6",
"@fastify/cookie": "^11.0.2",
"@fastify/multipart": "^10.0.0",
"@fastify/static": "^9.1.3",
"@keyv/redis": "^5.1.6",
"@fastify/cookie": "11.0.2",
"@fastify/multipart": "10.0.0",
"@fastify/static": "10.1.2",
"@keyv/redis": "5.1.6",
"@langchain/core": "1.1.46",
"@langchain/textsplitters": "1.0.1",
"@modelcontextprotocol/sdk": "1.29.0",
"@nest-lab/throttler-storage-redis": "^1.2.0",
"@modelcontextprotocol/sdk": "1.30.0",
"@nest-lab/throttler-storage-redis": "1.2.0",
"@nestjs-labs/nestjs-ioredis": "11.0.4",
"@nestjs/bullmq": "11.0.4",
"@nestjs/cache-manager": "3.1.3",
@@ -118,7 +118,7 @@
"tlds": "1.261.0",
"tmp-promise": "3.0.3",
"typesense": "3.0.5",
"undici": "7.28.0",
"undici": "7.29.0",
"ws": "8.21.0",
"yauzl": "3.4.0",
"zod": "4.3.6"
+2
View File
@@ -26,6 +26,7 @@ import KeyvRedis from '@keyv/redis';
import { LoggerModule } from './common/logger/logger.module';
import { ClsModule } from 'nestjs-cls';
import { NoopAuditModule } from './integrations/audit/audit.module';
import { NoopPageAnalyticsModule } from './integrations/page-analytics/page-analytics.module';
import { ThrottleModule } from './integrations/throttle/throttle.module';
const enterpriseModules = [];
@@ -50,6 +51,7 @@ try {
}),
LoggerModule,
NoopAuditModule,
NoopPageAnalyticsModule,
CoreModule,
DatabaseModule,
EnvironmentModule,
@@ -45,10 +45,6 @@ import {
TransclusionSource,
TransclusionReference,
BaseEmbed,
Tabs,
Tab,
TabLabel,
TabPanel,
} from '@docmost/editor-ext';
import { generateText, getSchema, JSONContent } from '@tiptap/core';
import { generateHTML, generateJSON } from '../common/helpers/prosemirror/html';
@@ -91,10 +87,6 @@ export const tiptapExtensions = [
Details,
DetailsContent,
DetailsSummary,
Tabs,
Tab,
TabLabel,
TabPanel,
CustomTable,
TableCell,
TableRow,
+1
View File
@@ -15,6 +15,7 @@ export const Feature = {
SCIM: 'scim',
PAGE_VERIFICATION: 'page:verification',
AUDIT_LOGS: 'audit:logs',
PAGE_ANALYTICS: 'analytics:page-analytics',
RETENTION: 'retention',
SHARING_CONTROLS: 'sharing:controls',
VIEWER_COMMENTS: 'comment:viewer',
@@ -42,6 +42,7 @@ function buildWorkspaceOwnerAbility() {
can(WorkspaceCaslAction.Manage, WorkspaceCaslSubject.Attachment);
can(WorkspaceCaslAction.Manage, WorkspaceCaslSubject.API);
can(WorkspaceCaslAction.Manage, WorkspaceCaslSubject.Audit);
can(WorkspaceCaslAction.Manage, WorkspaceCaslSubject.PageAnalytics);
return build();
}
@@ -13,6 +13,7 @@ export enum WorkspaceCaslSubject {
Attachment = 'attachment',
API = 'api_key',
Audit = 'audit',
PageAnalytics = 'page_analytics'
}
export type IWorkspaceAbility =
@@ -22,4 +23,5 @@ export type IWorkspaceAbility =
| [WorkspaceCaslAction, WorkspaceCaslSubject.Group]
| [WorkspaceCaslAction, WorkspaceCaslSubject.Attachment]
| [WorkspaceCaslAction, WorkspaceCaslSubject.API]
| [WorkspaceCaslAction, WorkspaceCaslSubject.Audit];
| [WorkspaceCaslAction, WorkspaceCaslSubject.Audit]
| [WorkspaceCaslAction, WorkspaceCaslSubject.PageAnalytics];
@@ -51,6 +51,10 @@ import {
AUDIT_SERVICE,
IAuditService,
} from '../../integrations/audit/audit.service';
import {
PAGE_ANALYTICS_SERVICE,
IPageAnalyticsService,
} from '../../integrations/page-analytics/page-analytics.service';
import { getPageTitle } from '../../common/helpers';
@UseGuards(JwtAuthGuard)
@@ -65,6 +69,7 @@ export class PageController {
private readonly backlinkService: BacklinkService,
private readonly labelService: LabelService,
@Inject(AUDIT_SERVICE) private readonly auditService: IAuditService,
@Inject(PAGE_ANALYTICS_SERVICE) private readonly pageAnalyticsService: IPageAnalyticsService,
) {}
@HttpCode(HttpStatus.OK)
@@ -88,6 +93,13 @@ export class PageController {
const permissions = { canEdit, hasRestriction };
void this.pageAnalyticsService.track({
pageId: page.id,
workspaceId: page.workspaceId,
spaceId: page.spaceId,
userId: user.id,
});
if (dto.format && dto.format !== 'json' && page.content) {
const contentOutput =
dto.format === 'markdown'
@@ -35,6 +35,10 @@ import {
AUDIT_SERVICE,
IAuditService,
} from '../../integrations/audit/audit.service';
import {
PAGE_ANALYTICS_SERVICE,
IPageAnalyticsService,
} from '../../integrations/page-analytics/page-analytics.service';
@UseGuards(JwtAuthGuard)
@Controller('shares')
@@ -47,6 +51,8 @@ export class ShareController {
private readonly pageAccessService: PageAccessService,
private readonly licenseCheckService: LicenseCheckService,
@Inject(AUDIT_SERVICE) private readonly auditService: IAuditService,
@Inject(PAGE_ANALYTICS_SERVICE)
private readonly pageAnalyticsService: IPageAnalyticsService,
) {}
@HttpCode(HttpStatus.OK)
@@ -79,6 +85,14 @@ export class ShareController {
throw new NotFoundException('Shared page not found');
}
void this.pageAnalyticsService.track({
pageId: shareData.page.id,
workspaceId: workspace.id,
spaceId: shareData.page.spaceId,
shareId: shareData.share.id,
userId: null,
});
return {
...shareData,
features: this.licenseCheckService.resolveFeatures(
@@ -0,0 +1,64 @@
import { Kysely, sql } from 'kysely';
export async function up(db: Kysely<any>): Promise<void> {
await db.schema
.createTable('page_analytics')
.ifNotExists()
.addColumn('id', 'uuid', (col) =>
col.primaryKey().defaultTo(sql`gen_uuid_v7()`),
)
.addColumn('workspace_id', 'uuid', (col) =>
col.references('workspaces.id').onDelete('cascade').notNull(),
)
.addColumn('page_id', 'uuid', (col) =>
col.references('pages.id').onDelete('cascade').notNull(),
)
.addColumn('space_id', 'uuid', (col) =>
col.references('spaces.id').onDelete('cascade'),
)
.addColumn('user_id', 'uuid', (col) =>
col.references('users.id').onDelete('set null'),
)
.addColumn('share_id', 'uuid')
.addColumn('visitor_id', 'varchar', (col) => col.notNull())
.addColumn('view_date', 'varchar', (col) => col.notNull())
.addColumn('hits', 'int8', (col) => col.notNull().defaultTo(1))
.addColumn('last_viewed_at', 'timestamptz', (col) =>
col.notNull().defaultTo(sql`now()`),
)
.addColumn('created_at', 'timestamptz', (col) =>
col.notNull().defaultTo(sql`now()`),
)
.execute();
await db.schema
.createIndex('idx_page_analytics_workspace_page_date')
.ifNotExists()
.on('page_analytics')
.columns(['workspace_id', 'page_id', 'view_date'])
.execute();
await sql`
CREATE UNIQUE INDEX IF NOT EXISTS
uq_page_analytics_workspace_page_identity
ON page_analytics (
workspace_id,
page_id,
COALESCE(user_id::text, visitor_id)
)
`.execute(db);
await db.schema
.alterTable('workspaces')
.addColumn('page_analytics_retention_days', 'int8', (col) => col)
.execute();
}
export async function down(db: Kysely<any>): Promise<void> {
await db.schema
.alterTable('workspaces')
.dropColumn('page_analytics_retention_days')
.execute();
await db.schema.dropTable('page_analytics').ifExists().execute();
}
+16
View File
@@ -437,6 +437,7 @@ export interface WorkspaceInvitations {
}
export interface Workspaces {
pageAnalyticsRetentionDays: Generated<number>;
auditRetentionDays: Generated<number>;
trashRetentionDays: Generated<number>;
billingEmail: string | null;
@@ -544,6 +545,20 @@ export interface PagePermissions {
updatedAt: Generated<Timestamp>;
}
export interface PageAnalytics {
id: Generated<string>;
workspaceId: string;
pageId: string;
spaceId: string | null;
shareId: string | null;
userId: string | null;
visitorId: string;
viewDate: string;
hits: Generated<number>;
lastViewedAt: Generated<Timestamp>;
createdAt: Generated<Timestamp>;
}
export interface PageVerifications {
id: Generated<string>;
pageId: string;
@@ -662,6 +677,7 @@ export interface DB {
pagePermissions: PagePermissions;
pageHistory: PageHistory;
pageLabels: PageLabels;
pageAnalytics: PageAnalytics;
pageVerifications: PageVerifications;
pageVerifiers: PageVerifiers;
pages: Pages;
@@ -1,6 +1,7 @@
import { Insertable, Selectable, Updateable } from 'kysely';
import {
AiChats,
PageAnalytics as _PageAnalytics,
AiChatMessages,
Attachments,
BaseProperties,
@@ -107,6 +108,10 @@ export type PageHistory = Selectable<History>;
export type InsertablePageHistory = Insertable<History>;
export type UpdatablePageHistory = Updateable<Omit<History, 'id'>>;
export type PageAnalytics = Selectable<_PageAnalytics>;
export type InsertablePageAnalytics = Insertable<_PageAnalytics>;
export type UpdatablePageAnalytics = Updateable<Omit<_PageAnalytics, 'id'>>;
// Comment
export type Comment = Selectable<Comments>;
export type InsertableComment = Insertable<Comments>;
@@ -0,0 +1,14 @@
import { Global, Module } from '@nestjs/common';
import { PAGE_ANALYTICS_SERVICE, NoopPageAnalyticsService } from './page-analytics.service';
@Global()
@Module({
providers: [
{
provide: PAGE_ANALYTICS_SERVICE,
useClass: NoopPageAnalyticsService,
},
],
exports: [PAGE_ANALYTICS_SERVICE],
})
export class NoopPageAnalyticsModule {}
@@ -0,0 +1,21 @@
import { Injectable } from '@nestjs/common';
export type PageAnalyticsPayload = {
pageId: string;
workspaceId?: string;
spaceId?: string;
shareId?: string;
userId?: string | null;
visitorId?: string;
};
export const PAGE_ANALYTICS_SERVICE = Symbol('PAGE_ANALYTICS_SERVICE');
export interface IPageAnalyticsService {
track(payload: PageAnalyticsPayload): void | Promise<void>;
}
@Injectable()
export class NoopPageAnalyticsService implements IPageAnalyticsService {
track(_payload: PageAnalyticsPayload): void {}
}
@@ -9,6 +9,7 @@ export enum QueueName {
HISTORY_QUEUE = '{history-queue}',
NOTIFICATION_QUEUE = '{notification-queue}',
AUDIT_QUEUE = '{audit-queue}',
PAGE_ANALYTICS_QUEUE = '{page-analytics-queue}',
BASE_QUEUE = '{base-queue}',
}
@@ -81,6 +82,8 @@ export enum QueueJob {
AUDIT_LOG = 'audit-log',
AUDIT_CLEANUP = 'audit-cleanup',
PAGE_ANALYTICS_TRACK = 'page-analytics-track',
PAGE_ANALYTICS_CLEANUP = 'page-analytics-cleanup',
PDF_EXPORT_TASK = 'pdf-export-task',
PDF_EXPORT_CLEANUP = 'pdf-export-cleanup',
@@ -92,6 +92,14 @@ import { GeneralQueueProcessor } from './processors/general-queue.processor';
attempts: 3,
},
}),
BullModule.registerQueue({
name: QueueName.PAGE_ANALYTICS_QUEUE,
defaultJobOptions: {
removeOnComplete: true,
removeOnFail: true,
attempts: 3,
},
}),
BullModule.registerQueue({
name: QueueName.BASE_QUEUE,
defaultJobOptions: {
+4 -4
View File
@@ -65,7 +65,7 @@
"date-fns": "4.1.0",
"diff": "8.0.3",
"docx": "9.7.1",
"dompurify": "3.4.11",
"dompurify": "3.4.12",
"fractional-indexing-jittered": "1.0.0",
"highlight.js": "11.11.1",
"image-dimensions": "2.5.0",
@@ -81,12 +81,12 @@
"yjs": "^13.6.30"
},
"devDependencies": {
"@nx/js": "22.6.1",
"@nx/js": "22.7.2",
"@types/bytes": "3.1.5",
"@types/qrcode": "1.5.6",
"@types/turndown": "5.0.6",
"concurrently": "9.2.3",
"nx": "22.6.1",
"concurrently": "10.0.4",
"nx": "22.7.2",
"tsx": "^4.21.0"
},
"workspaces": {
-1
View File
@@ -30,7 +30,6 @@ export * from "./lib/shared-storage";
export * from "./lib/recreate-transform";
export * from "./lib/columns";
export * from "./lib/status";
export * from "./lib/tabs";
export * from "./lib/pdf";
export * from "./lib/page-break";
export * from "./lib/resizable-nodeview";
@@ -2,7 +2,6 @@ import { marked } from "marked";
import { calloutExtension } from "./callout.marked";
import { mathBlockExtension } from "./math-block.marked";
import { mathInlineExtension } from "./math-inline.marked";
import { tabsExtension } from "./tabs.marked";
marked.use({
renderer: {
@@ -35,12 +34,7 @@ marked.use({
});
marked.use({
extensions: [
calloutExtension,
mathBlockExtension,
mathInlineExtension,
tabsExtension,
],
extensions: [calloutExtension, mathBlockExtension, mathInlineExtension],
});
marked.setOptions({ breaks: true });
@@ -1,152 +0,0 @@
import { marked, type Token } from 'marked';
interface MarkdownTab {
label: string;
text: string;
forceActive: boolean;
}
interface TabbedToken {
type: 'tabbed';
raw: string;
tabs: MarkdownTab[];
activeTabIndex: number;
}
const HEADER_RE =
/^===([!+])?\s*["'“”‘’]((?:\\["\\]|[^\\"'“”‘’\n])+?)["'“”‘’]\s*$/gm;
export const tabsExtension = {
name: 'tabbed',
level: 'block',
start(src: string) {
return src.search(/^===(?:[!+])?\s*["'“”‘’]/m);
},
tokenizer(src: string): TabbedToken | undefined {
if (src.indexOf('===') === -1) return;
const headers: Array<{
index: number;
raw: string;
marker: string;
label: string;
}> = [];
HEADER_RE.lastIndex = 0;
for (let m = HEADER_RE.exec(src); m !== null; m = HEADER_RE.exec(src)) {
headers.push({
index: m.index,
raw: m[0],
marker: m[1] ?? '',
label: unescapeTabLabel(m[2].trim()),
});
}
if (headers.length < 1 || headers[0].index !== 0) return;
const tabs: MarkdownTab[] = [];
let consumed = 0;
let breakOutOfTabSet = false;
for (let i = 0; i < headers.length; i++) {
const h = headers[i];
if (i > 0 && h.marker === '!') break;
const headerEnd = h.index + h.raw.length;
const bodyStart =
src.charCodeAt(headerEnd) === 10 ? headerEnd + 1 : headerEnd;
const next = headers[i + 1];
const bodyLimit = next ? next.index : src.length;
let bodyEnd = bodyLimit;
let lineStart = bodyStart;
while (lineStart < bodyLimit) {
const newlineIndex = src.indexOf('\n', lineStart);
const lineEnd =
newlineIndex === -1 || newlineIndex > bodyLimit
? bodyLimit
: newlineIndex;
const line = src.slice(lineStart, lineEnd);
const isBlank = line.trim() === '';
const isIndented = /^( {2,4}|\t)/.test(line);
if (!isBlank && !isIndented) {
bodyEnd = lineStart;
breakOutOfTabSet = true;
break;
}
lineStart = lineEnd < bodyLimit ? lineEnd + 1 : bodyLimit;
}
let body = src.slice(bodyStart, bodyEnd).replace(/\n+$/, '');
if (body.length > 0) {
body = body
.split('\n')
.map((line) => line.replace(/^(?:\t| {2,4})/, ''))
.join('\n');
}
tabs.push({
label: h.label,
text: body,
forceActive: h.marker === '+',
});
consumed = bodyEnd;
if (breakOutOfTabSet) break;
}
if (tabs.length < 1) return;
const forcedActiveIndex = tabs.findIndex((t) => t.forceActive);
return {
type: 'tabbed',
raw: src.slice(0, consumed),
tabs,
activeTabIndex: Math.max(forcedActiveIndex, 0),
};
},
renderer(token: Token) {
const tabbedToken = token as TabbedToken;
const activeTabIndex = Math.max(
0,
Math.min(tabbedToken.activeTabIndex ?? 0, tabbedToken.tabs.length - 1),
);
const sections = tabbedToken.tabs.map((tab, index) => {
const label = escapeHtml(tab.label);
const panel = marked.parse(tab.text || '').toString();
const isActive = index === activeTabIndex;
const activeAttrs = isActive
? 'data-tab-active="true"'
: 'data-tab-active="false"';
return `<div data-type="tab" aria-hidden="true" ${activeAttrs}><div data-type="tabLabel">${label}</div><div data-type="tabPanel" >${panel}</div></div>`;
});
return `<div data-type="tabs" data-active-tab="${activeTabIndex}">${sections.join('')}</div>`;
},
};
function unescapeTabLabel(value: string): string {
return value.replace(/\\(["\\])/g, '$1');
}
function escapeHtml(value: string): string {
return value
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#39;');
}
@@ -24,7 +24,6 @@ export function htmlToMarkdown(html: string): string {
TurndownPluginGfm.tables,
TurndownPluginGfm.strikethrough,
TurndownPluginGfm.highlightedCodeBlock,
tabs,
taskList,
callout,
preserveDetail,
@@ -39,64 +38,6 @@ export function htmlToMarkdown(html: string): string {
return turndownService.turndown(html).replaceAll('<br>', ' ');
}
const hasPreviousTabs = (node: HTMLElement) => {
// we want to make this as cheap as reasonable since it
// would be preferable to return a false positive
// than to make the editor noticably slower
let el = node.previousElementSibling;
let checks = 0;
while (el) {
if (el.getAttribute('data-type') === 'tabs') return true;
el = el.previousElementSibling;
checks += 1;
if (checks === 100) return true;
}
return false;
};
function tabs(turndownService: _TurndownService) {
turndownService.addRule('tabs', {
filter: (node: HTMLInputElement) =>
node.nodeName === 'DIV' && node.getAttribute('data-type') === 'tabs',
replacement: (content: string, node: HTMLInputElement) => {
const tabNodes = Array.from(
node.querySelectorAll(':scope > div[data-type="tab"]'),
);
if (tabNodes.length === 0) return content;
const isNestedTabsNode =
node.parentElement?.closest('div[data-type="tabs"]') !== null;
const tabBlocks = tabNodes.map((tabNode, index) => {
const labelNode = tabNode.querySelector(
':scope > div[data-type="tabLabel"]',
);
const panelNode = tabNode.querySelector(
':scope > div[data-type="tabPanel"]',
);
const label = sanitizeTabLabel(labelNode?.textContent || 'Tab');
const panelMarkdown = panelNode
? turndownService.turndown(panelNode.innerHTML).trim()
: '';
const isFirstTabInSet = index === 0;
const marker =
isFirstTabInSet && !isNestedTabsNode && hasPreviousTabs(node)
? '!'
: '';
return `===${marker} "${label}"\n${indentMarkdownBlock(panelMarkdown)}`;
});
return `\n\n${tabBlocks.join('\n\n')}\n\n`;
},
});
}
function listParagraph(turndownService: _TurndownService) {
turndownService.addRule('paragraph', {
filter: ['p'],
@@ -112,9 +53,7 @@ function listParagraph(turndownService: _TurndownService) {
function orderedListItem(turndownService: _TurndownService) {
turndownService.addRule('orderedListItem', {
filter: function (node: HTMLInputElement) {
return (
node.nodeName === 'LI' && node.getAttribute('data-type') !== 'taskItem'
);
return node.nodeName === 'LI' && node.getAttribute('data-type') !== 'taskItem';
},
replacement: (content: string, node: HTMLInputElement, options: any) => {
const parent = node.parentNode as HTMLElement;
@@ -175,7 +114,9 @@ function taskList(turndownService: _TurndownService) {
const prefix = `- ${isChecked ? '[x]' : '[ ]'} `;
return (
prefix + text + (node.nextSibling && !/\n$/.test(text) ? '\n' : '')
prefix +
text +
(node.nextSibling && !/\n$/.test(text) ? '\n' : '')
);
},
});
@@ -270,25 +211,10 @@ function video(turndownService: _TurndownService) {
replacement: function (_content: string, node: HTMLInputElement) {
const src = node.getAttribute('src') || '';
const ariaLabel = node.getAttribute('aria-label');
const name = sanitizeMdLinkText(ariaLabel || getBasename(src) || src);
const name = sanitizeMdLinkText(
ariaLabel || getBasename(src) || src,
);
return '[' + name + '](' + src + ')';
},
});
}
function sanitizeTabLabel(value: string): string {
return value
.replace(/[\r\n]+/g, ' ')
.replace(/\\/g, '\\\\')
.replace(/"/g, '\\"')
.trim();
}
function indentMarkdownBlock(content: string): string {
if (!content) return '\t';
return content
.split('\n')
.map((line) => (line.trim() ? `\t${line}` : ''))
.join('\n');
}
@@ -1,8 +0,0 @@
export { Tabs } from "./tabs";
export { Tab } from "./tab";
export { TabLabel } from "./tab-label";
export { TabPanel } from "./tab-panel";
export type { TabsOptions } from "./tabs";
export type { TabOptions } from "./tab";
export type { TabLabelOptions } from "./tab-label";
export type { TabPanelOptions } from "./tab-panel";
@@ -1,42 +0,0 @@
import { mergeAttributes, Node } from "@tiptap/core";
export interface TabLabelOptions {
HTMLAttributes: Record<string, unknown>;
}
export const TabLabel = Node.create<TabLabelOptions>({
name: "tabLabel",
content: "inline*",
defining: true,
selectable: false,
addOptions() {
return {
HTMLAttributes: {},
};
},
parseHTML() {
return [
{
tag: `div[data-type="${this.name}"]`,
},
];
},
renderHTML({ HTMLAttributes }) {
return [
"div",
mergeAttributes(
{
"data-type": this.name,
"aria-hidden": "true",
class: "not-draggable-match"
},
this.options.HTMLAttributes,
HTMLAttributes,
),
0,
];
},
});
@@ -1,37 +0,0 @@
import { mergeAttributes, Node } from "@tiptap/core";
export interface TabPanelOptions {
HTMLAttributes: Record<string, unknown>;
}
export const TabPanel = Node.create<TabPanelOptions>({
name: "tabPanel",
content: "block+",
defining: true,
addOptions() {
return {
HTMLAttributes: {},
};
},
parseHTML() {
return [
{
tag: `div[data-type="${this.name}"]`,
},
];
},
renderHTML({ HTMLAttributes }) {
return [
"div",
mergeAttributes(
{ "data-type": this.name, role: "tabpanel", class: "not-draggable-match" },
this.options.HTMLAttributes,
HTMLAttributes,
),
0,
];
},
});
-72
View File
@@ -1,72 +0,0 @@
import { mergeAttributes, Node } from '@tiptap/core';
import { generateNodeId } from "../utils";
export interface TabOptions {
HTMLAttributes: Record<string, unknown>;
}
export const Tab = Node.create<TabOptions>({
name: 'tab',
content: 'tabLabel tabPanel',
defining: true,
isolating: true,
addOptions() {
return {
HTMLAttributes: {},
};
},
addAttributes() {
return {
id: {
default: '',
parseHTML: (element: HTMLElement) =>
element.getAttribute('data-tab-id') ?? generateNodeId(),
renderHTML: (attributes: { id?: string }) => ({
'data-tab-id': attributes.id ?? '',
}),
},
active: {
default: true,
parseHTML: (element: HTMLElement) => {
const rawValue = element.getAttribute('data-tab-active');
if (rawValue === null) {
return !element.hasAttribute('hidden');
}
return rawValue === 'true';
},
renderHTML: (attributes: { active?: boolean }) => {
const isActive = attributes.active !== false;
return {
'data-tab-active': isActive ? 'true' : 'false',
'aria-hidden': isActive ? 'false' : 'true',
...(isActive ? {} : { hidden: 'hidden' }),
};
},
},
};
},
parseHTML() {
return [
{
tag: `div[data-type="${this.name}"]`,
},
];
},
renderHTML({ HTMLAttributes }) {
return [
'div',
mergeAttributes(
{ 'data-type': this.name },
this.options.HTMLAttributes,
HTMLAttributes,
),
0,
];
},
});
-463
View File
@@ -1,463 +0,0 @@
import { InputRule, Node, Range, mergeAttributes } from '@tiptap/core';
import { Fragment, type Node as PMNode } from '@tiptap/pm/model';
import {
TextSelection,
type Transaction,
type EditorState,
} from '@tiptap/pm/state';
import { ReactNodeViewRenderer, type ReactNodeViewProps } from '@tiptap/react';
import type { ComponentType } from 'react';
import { generateNodeId } from '../utils';
import { findParentNode } from '../table/utils';
export interface TabsOptions {
HTMLAttributes: Record<string, unknown>;
view: ComponentType<ReactNodeViewProps<HTMLElement>> | null;
}
const TAB_INPUT_REGEX =
/^\s*===\s*["'“”‘’]((?:\\["\\]|[^\\"'“”‘’\n])+?)["'“”‘’]\s+$/;
declare module '@tiptap/core' {
interface Commands<ReturnType> {
tabs: {
insertTabs: (tabName?: string, range?: Range) => ReturnType;
insertTab: (pos: 'right' | 'left') => ReturnType;
moveTab: (pos: 'right' | 'left') => ReturnType;
setActiveTab: (index: number, tabsPos: number) => ReturnType;
deleteTabs: () => ReturnType;
updateTabLabel: (
index: number,
label: string,
tabsPos: number,
) => ReturnType;
};
}
}
export const Tabs = Node.create<TabsOptions>({
name: 'tabs',
group: 'block',
content: 'tab+',
defining: true,
isolating: true,
addOptions() {
return { HTMLAttributes: {}, view: null };
},
addAttributes() {
return {
activeTab: {
default: 0,
parseHTML: (element) =>
Number(element.getAttribute('data-active-tab')) || 0,
renderHTML: (attributes) => ({
'data-active-tab': clampIndex(attributes.activeTab),
}),
},
};
},
parseHTML() {
return [{ tag: `div[data-type="${this.name}"]` }];
},
renderHTML({ HTMLAttributes }) {
return [
'div',
mergeAttributes(
{ 'data-type': this.name },
this.options.HTMLAttributes,
HTMLAttributes,
),
0,
];
},
addNodeView() {
if (!this.options.view) return undefined;
this.editor.isInitialized = true;
return ReactNodeViewRenderer(this.options.view);
},
addInputRules() {
return [
new InputRule({
find: TAB_INPUT_REGEX,
handler: ({ range, match }) => {
const rawLabel = typeof match[1] === 'string' ? match[1] : 'Tab 1';
const label = rawLabel.replace(/\\(["\\])/g, '$1').trim();
this.editor.commands.insertTabs(label, range);
},
}),
];
},
addCommands() {
const createTab = (
schema: EditorState['schema'],
label: string,
active: boolean,
) => {
const { tab, tabLabel, tabPanel, paragraph } = schema.nodes;
if (!tab || !tabLabel || !tabPanel || !paragraph) return null;
return tab.create({ id: generateNodeId(), active }, [
tabLabel.create(null, schema.text(label || ' ')),
tabPanel.create(null, paragraph.create()),
]);
};
const getTabPos = (doc: PMNode, tabsPos: number, tabIndex: number) => {
const pos = doc.resolve(tabsPos + 1);
return pos.posAtIndex(tabIndex, pos.depth);
};
const applyActiveTabState = (
tr: Transaction,
tabsPos: number,
previousIndex: number,
nextIndex: number,
) => {
const tabsNode = tr.doc.nodeAt(tabsPos);
if (tabsNode?.type.name !== 'tabs' || tabsNode.childCount <= 0) {
return null;
}
const prev = clampIndex(previousIndex, tabsNode.childCount);
const next = clampIndex(nextIndex, tabsNode.childCount);
tr.setNodeMarkup(tabsPos, undefined, {
...tabsNode.attrs,
activeTab: next,
});
const prevTabPos = getTabPos(tr.doc, tabsPos, prev);
const nextTabPos = getTabPos(tr.doc, tabsPos, next);
if (prev !== next) {
const prevTabNode = tr.doc.nodeAt(prevTabPos);
if (prevTabNode) {
tr.setNodeMarkup(prevTabPos, undefined, {
...prevTabNode.attrs,
active: false,
});
}
}
const nextTabNode = tr.doc.nodeAt(nextTabPos);
if (nextTabNode) {
tr.setNodeMarkup(nextTabPos, undefined, {
...nextTabNode.attrs,
active: true,
});
}
return nextTabPos;
};
const selectTabPanel = (
tr: Transaction,
tabsPos: number,
tabPos: number,
) => {
const tabsNode = tr.doc.nodeAt(tabsPos);
if (tabsNode?.type.name !== 'tabs' || tabsNode.childCount <= 0) {
return null;
}
const tabNode = tr.doc.nodeAt(tabPos);
const labelSize = tabNode?.child(0).nodeSize ?? 0;
const panelContentPos = tabPos + 1 + labelSize + 1;
tr.setSelection(TextSelection.near(tr.doc.resolve(panelContentPos), 1));
};
return {
insertTabs:
(tabName?: string, range?: Range) =>
({ tr, state, dispatch }) => {
const firstTab = createTab(state.schema, tabName ?? 'Tab 1', true);
if (!firstTab) return false;
const tabsNode = this.type.create(
{
activeTab: 0,
},
Fragment.fromArray([firstTab]),
);
const insertionPos = tr.selection.from;
if (range) {
tr.replaceRangeWith(
range.from,
range.to,
tabsNode,
).scrollIntoView();
} else {
tr.replaceSelectionWith(tabsNode).scrollIntoView();
}
const firstTabPos = getTabPos(tr.doc, insertionPos, 0);
const firstTabNode = tr.doc.nodeAt(firstTabPos);
if (!firstTabNode) return false;
if (!range) {
const labelSize = firstTabNode.child(0)?.nodeSize ?? 0;
const panelContentPos = firstTabPos + 2 + labelSize + 2;
tr.setSelection(
TextSelection.near(tr.doc.resolve(panelContentPos), 1),
);
}
if (dispatch) dispatch(tr);
return true;
},
insertTab:
(pos: 'left' | 'right') =>
({ state, tr, dispatch }) => {
const { $from } = state.selection;
const tabs = findParentNode(
(node) => node.type.name === this.name,
$from,
);
if (!tabs || tabs.node.childCount <= 0) return false;
const currentTabIndex = clampIndex(
tabs.node.attrs.activeTab,
tabs.node.childCount,
);
const insertIndex =
pos === 'right' ? currentTabIndex + 1 : currentTabIndex;
const newTab = createTab(state.schema, 'Tab', false);
if (!newTab) return false;
const insertPos = getTabPos(state.doc, tabs.pos, insertIndex);
tr.insert(insertPos, newTab);
const insertedTabPos = getTabPos(tr.doc, tabs.pos, insertIndex);
tr.setNodeMarkup(insertedTabPos, undefined, {
...newTab.attrs,
active: true,
});
const previousActiveIndex =
pos === 'left' ? currentTabIndex + 1 : currentTabIndex;
const activeTabPos = applyActiveTabState(
tr,
tabs.pos,
previousActiveIndex,
insertIndex,
);
if (activeTabPos == null) return false;
selectTabPanel(tr, tabs.pos, insertedTabPos);
if (dispatch) dispatch(tr);
return true;
},
moveTab:
(pos: 'left' | 'right') =>
({ state, tr, dispatch }) => {
const { $from } = state.selection;
const tabs = findParentNode(
(node) => node.type.name === this.name,
$from,
);
if (!tabs || tabs.node.childCount <= 1) return false;
const currentTabIndex = clampIndex(
tabs.node.attrs.activeTab,
tabs.node.childCount,
);
const targetIndex =
pos === 'left' ? currentTabIndex - 1 : currentTabIndex + 1;
if (targetIndex < 0 || targetIndex >= tabs.node.childCount)
return false;
const currentTabPos = getTabPos(state.doc, tabs.pos, currentTabIndex);
const currentTabNode = state.doc.nodeAt(currentTabPos);
if (!currentTabNode) return false;
const mappedCurrentTabPos = tr.mapping.map(currentTabPos);
tr.delete(
mappedCurrentTabPos,
mappedCurrentTabPos + currentTabNode.nodeSize,
);
const insertPos = getTabPos(tr.doc, tabs.pos, targetIndex);
tr.insert(insertPos, currentTabNode);
const movedTabPos = applyActiveTabState(
tr,
tabs.pos,
targetIndex,
targetIndex,
);
selectTabPanel(tr, tabs.pos, movedTabPos);
if (dispatch) dispatch(tr.scrollIntoView());
return true;
},
setActiveTab:
(index, tabsPos) =>
({ state, tr, dispatch }) => {
const tabsNode = state.doc.nodeAt(tabsPos);
if (tabsNode?.childCount <= 0) return false;
const nextIndex = clampIndex(index, tabsNode.childCount);
const prevIndex = clampIndex(
tabsNode.attrs.activeTab,
tabsNode.childCount,
);
const activeTabPos = applyActiveTabState(
tr,
tabsPos,
prevIndex,
nextIndex,
);
if (activeTabPos == null) return false;
selectTabPanel(tr, tabsPos, activeTabPos);
if (dispatch) dispatch(tr.scrollIntoView());
return true;
},
updateTabLabel:
(index, label, tabsPos) =>
({ state, tr, dispatch }) => {
const tabsNode = state.doc.nodeAt(tabsPos);
if (!tabsNode) return false;
const labelIndex = clampIndex(index, tabsNode.childCount);
const $tabs = state.doc.resolve(tabsPos + 1);
const tabPos = $tabs.posAtIndex(labelIndex, $tabs.depth);
const labelNode = state.doc.nodeAt(tabPos + 1);
const labelContentPos = tabPos + 2;
tr.replaceWith(
labelContentPos,
labelContentPos + labelNode.content.size,
state.schema.text(label || ' '),
);
if (dispatch) dispatch(tr);
return true;
},
deleteTab:
() =>
({ state, tr, dispatch }) => {
const { $from } = state.selection;
const tabs = findParentNode(
(node) => node.type.name === this.name,
$from,
);
if (!tabs) return false;
if (tabs.node.childCount < 2) {
this.editor.commands.deleteTabs();
return true;
}
const currentTabIndex = clampIndex(
tabs.node.attrs.activeTab,
tabs.node.childCount,
);
const currentTabPos = getTabPos(state.doc, tabs.pos, currentTabIndex);
const currentTabNode = state.doc.nodeAt(currentTabPos);
if (!currentTabNode) return false;
const nextTabIndex =
currentTabIndex < tabs.node.childCount - 1
? currentTabIndex
: currentTabIndex - 1;
tr.delete(currentTabPos, currentTabPos + currentTabNode.nodeSize);
const activeTabPos = applyActiveTabState(
tr,
tabs.pos,
nextTabIndex,
nextTabIndex,
);
if (activeTabPos == null) return false;
selectTabPanel(tr, tabs.pos, activeTabPos);
if (dispatch) dispatch(tr);
return true;
},
deleteTabs:
() =>
({ state, tr, dispatch }) => {
const { $from } = state.selection;
const tabs = findParentNode(
(node) => node.type.name === this.name,
$from,
);
if (tabs?.node.childCount <= 0) return false;
tr.delete(tabs.pos, tabs.pos + tabs.node.nodeSize);
if (dispatch) dispatch(tr);
return true;
},
};
},
addKeyboardShortcuts() {
return {
Enter: ({ editor }) => {
const { state } = editor;
const { $from, empty } = state.selection;
if (!empty) return false;
if ($from.parent.content.size > 0) return false;
const tabsNode = findParentNode(
(node) => node.type.name === this.name,
$from,
);
if (!tabsNode) return false;
return editor
.chain()
.command(({ tr, state }) => {
const posAfter = $from.after(tabsNode.depth);
tr.delete($from.before(), $from.after());
const targetPos = tr.mapping.map(posAfter);
const paragraph = state.schema.nodes.paragraph.create();
tr.insert(targetPos, paragraph);
tr.setSelection(TextSelection.create(tr.doc, targetPos + 1));
return true;
})
.scrollIntoView()
.run();
},
};
},
});
const clampIndex = (value: unknown, length = Number.MAX_SAFE_INTEGER) => {
const parsed = Number(value ?? 0);
if (!Number.isFinite(parsed) || length <= 0) return 0;
return Math.max(0, Math.min(Math.trunc(parsed), length - 1));
};
+1346 -1192
View File
File diff suppressed because it is too large Load Diff
+7 -35
View File
@@ -5,54 +5,26 @@ patchedDependencies:
scimmy@1.3.5: patches/scimmy@1.3.5.patch
overrides:
prosemirror-changeset: 2.4.0
y-prosemirror: 1.3.7
glob: 13.0.6
ws: 8.21.0
dompurify: 3.4.11
tmp: 0.2.7
hono: 4.12.25
dompurify: 3.4.12
mermaid: 11.15.0
undici: 7.29.0
tmp: 0.2.7
nanoid@^3: 3.3.8
socket.io-parser: 4.2.6
serialize-javascript: 7.0.3
lodash-es: 4.18.1
lodash: 4.18.1
'@hono/node-server': 1.19.13
undici: 7.28.0
ajv@^6: 6.14.0
ajv@^8: 8.18.0
underscore: 1.13.8
immutable: 4.3.8
express-rate-limit: 8.2.2
minimatch@^3: 3.1.5
minimatch@^5: 5.1.8
flatted: 3.4.2
picomatch@<2.3.2: 2.3.2
picomatch@>=4.0.0 <4.0.4: 4.0.4
fastify: 5.8.5
yaml@>=1.0.0 <1.10.3: 1.10.3
find-my-way: 9.7.0
yaml@>=2.0.0 <2.8.3: 2.8.3
path-to-regexp@^8: 8.4.0
brace-expansion@^5: 5.0.6
'@xmldom/xmldom': 0.8.13
handlebars: 4.7.9
brace-expansion@^5: 5.0.9
axios: 1.18.1
langsmith: 0.7.0
follow-redirects: 1.16.0
protobufjs: 7.5.8
ip-address: 10.1.1
fast-uri: 3.1.3
ip-address: 10.3.1
fast-uri: 3.1.5
form-data@>=4.0.0 <4.0.6: 4.0.6
nanoid@>=4.0.0 <5.0.9: 5.1.16
qs: 6.15.3
esbuild@>=0.27.3 <0.28.1: 0.28.1
'@babel/core@<=7.29.0': 7.29.7
'@opentelemetry/core@>=2.0.0 <2.8.0': 2.9.0
'@babel/plugin-transform-modules-systemjs@<=7.29.3': 7.29.7
brace-expansion@<1.1.13: 1.1.15
brace-expansion@>=2.0.0 <2.0.3: 2.0.3
js-yaml@>=3.0.0 <3.15.0: 3.15.0
js-yaml@>=4.0.0 <=4.1.1: 4.3.0
shamefullyHoist: true
minimumReleaseAge: 4320
allowBuilds: