mirror of
https://github.com/hanzo-apps/dataroom.git
synced 2026-10-30 14:47:36 +00:00
zeekayandHanzo Dev
f77d5010d8
Papermark dual-licenses: AGPL-3.0 for the tree, a separate commercial
licence for ee/. We hold the first and not the second, so none of the
second may live here.
ee/ was already absent from main, but it was never deleted. 98f0da7fa
("ci: amd64-only build") renamed 150 files out of ee/ byte-identical
into features/, lib/billing/legacy/ (ee/stripe), lib/billing/limits/
(ee/limits), and flattened app/(ee)/ into app/ — putting commercially
licensed code under our AGPL root LICENSE. A rename is not a deletion.
Every path that commit moved is now gone, edited-since or not.
Deleted, with their routes and UI entry points: features/ai and
app/api/ai, features/workflows and app/api/{workflows,workflow-entry},
features/conversations and the Q&A/FAQ surface, features/security/sso
with app/api/auth/saml + app/api/scim + lib/jackson.ts (we use Hanzo
IAM OIDC natively), features/dataroom-invitations, features/templates,
features/access-notifications, features/conversions, features/
permissions. Five of these were gated by lib/featureFlags, which reads
@vercel/edge-config and returns false for every flag when EDGE_CONFIG
is unset — every non-Vercel deployment we run. Those flags are gone too.
Deleted the commercial gating outright rather than reimplementing it:
lib/billing/legacy (ee/stripe) and lib/billing/limits (ee/limits), the
upgrade modals and banners, UpgradeButton, FeaturePreview, PlanBadge,
the trial and blocking modals, /settings/upgrade, /settings/billing and
the billing checkout/seat/pause/cancel API. usePlan() no longer returns
capability booleans — the plan tag describes provisioning, it is not a
permission — and useLimits() is gone with every quota check it fed.
Subscription pause went the same way. Also dropped the npm dependencies
that existed only for the removed features (@boxyhq/saml-jackson, the
@ai-sdk packages, openai, streamdown, use-stick-to-bottom,
@trigger.dev/python) and the Jackson-specific next.config webpack shims.
Rewritten as original Hanzo code where a capability was load-bearing:
- lib/utils/get-file-size-limits.ts — one UPLOAD_LIMITS set plus
getFileSizeLimit(contentType), env-overridable. Operational limits,
not commercial ones, so the tus and browser-upload paths still refuse
oversized files without consulting a plan matrix.
- components/links/link-sheet/permissions-sheet.tsx — a flat, depth
annotated item list with view/download switches over the same
/permission-groups API. Two states, not three. ItemPermission now has
a single definition in lib/types.ts.
- app/api/links/[id]/upload/route.ts — visitor uploads, built around one
authorize() helper shared by GET and POST, and a notification debounce
keyed per (link, viewer) instead of listing and cancelling runs.
There is now exactly one link sheet: the ee DataroomLinkSheet duplicated
the AGPL LinkSheet, which already handled DATAROOM_LINK. Replaced
upstream's Omit<LinkType, "WORKFLOW_LINK"> — Omit on a string union
yields an object type and never narrowed anything — with a real union.
Verified: the S3/tus upload+download harness passes 13/13 against MinIO
after the deletions, and tsc goes from 257 pre-existing errors on
origin/main to 192 with zero files worse than baseline.
Reasoning recorded in LLM.md. LICENSE untouched.
Co-authored-by: Hanzo Dev <[email protected]>
437 lines
16 KiB
TypeScript
437 lines
16 KiB
TypeScript
import { ChangeEvent, useCallback, useEffect, useState } from "react";
|
|
|
|
import { LinkPreset } from "@prisma/client";
|
|
import { Label } from "@radix-ui/react-label";
|
|
import { Upload as ArrowUpTrayIcon, PlusIcon } from "lucide-react";
|
|
import { motion } from "motion/react";
|
|
|
|
import { FADE_IN_ANIMATION_SETTINGS } from "@/lib/constants";
|
|
import { cn, fetcher, validateImageDimensions } from "@/lib/utils";
|
|
import { resizeImage } from "@/lib/utils/resize-image";
|
|
|
|
import { Input } from "@/components/ui/input";
|
|
import LoadingSpinner from "@/components/ui/loading-spinner";
|
|
import { Textarea } from "@/components/ui/textarea";
|
|
|
|
import { DEFAULT_LINK_TYPE } from ".";
|
|
import LinkItem from "./link-item";
|
|
|
|
export default function OGSection({
|
|
data,
|
|
setData,
|
|
editLink,
|
|
presets,
|
|
}: {
|
|
data: DEFAULT_LINK_TYPE;
|
|
setData: React.Dispatch<React.SetStateAction<DEFAULT_LINK_TYPE>>;
|
|
editLink: boolean;
|
|
presets: LinkPreset | null;
|
|
}) {
|
|
const {
|
|
enableCustomMetatag,
|
|
metaTitle,
|
|
metaDescription,
|
|
metaImage,
|
|
metaFavicon,
|
|
} = data;
|
|
|
|
const [enabled, setEnabled] = useState<boolean>(false);
|
|
const [fileError, setFileError] = useState<string | null>(null);
|
|
const [dragActive, setDragActive] = useState(false);
|
|
const [faviconFileError, setFaviconFileError] = useState<string | null>(null);
|
|
const [faviconDragActive, setFaviconDragActive] = useState(false);
|
|
|
|
const onChangePicture = useCallback(
|
|
async (e: any) => {
|
|
setFileError(null);
|
|
const file = e.target.files[0];
|
|
if (file) {
|
|
if (file.size / 1024 / 1024 > 5) {
|
|
setFileError("File size too big (max 5MB)");
|
|
} else if (file.type !== "image/png" && file.type !== "image/jpeg") {
|
|
setFileError("File type not supported (.png or .jpg only)");
|
|
} else {
|
|
const image = await resizeImage(file);
|
|
setData((prev) => ({
|
|
...prev,
|
|
metaImage: image,
|
|
}));
|
|
}
|
|
}
|
|
},
|
|
[setData],
|
|
);
|
|
|
|
useEffect(() => {
|
|
setEnabled(enableCustomMetatag);
|
|
}, [enableCustomMetatag]);
|
|
|
|
const handleCustomMetatag = async () => {
|
|
const updatedCustomMetatag = !enabled;
|
|
|
|
setData({ ...data, enableCustomMetatag: updatedCustomMetatag });
|
|
setEnabled(updatedCustomMetatag);
|
|
};
|
|
|
|
const resetMetatags = () => {
|
|
setData({
|
|
...data,
|
|
metaImage: presets?.metaImage ?? null,
|
|
metaTitle: presets?.metaTitle ?? null,
|
|
metaDescription: presets?.metaDescription ?? null,
|
|
});
|
|
};
|
|
|
|
const onChangeFavicon = useCallback(
|
|
async (e: ChangeEvent<HTMLInputElement>) => {
|
|
setFaviconFileError(null);
|
|
const file = e.target.files && e.target.files[0];
|
|
if (file) {
|
|
if (file.size / 1024 / 1024 > 1) {
|
|
setFaviconFileError("File size too big (max 1MB)");
|
|
} else if (
|
|
file.type !== "image/png" &&
|
|
file.type !== "image/x-icon" &&
|
|
file.type !== "image/svg+xml"
|
|
) {
|
|
setFaviconFileError(
|
|
"File type not supported (.png, .ico, .svg only)",
|
|
);
|
|
} else {
|
|
const image = await resizeImage(file, {
|
|
width: 36,
|
|
height: 36,
|
|
quality: 1,
|
|
});
|
|
const isValidDimensions = await validateImageDimensions(
|
|
image,
|
|
16,
|
|
48,
|
|
);
|
|
if (!isValidDimensions) {
|
|
setFaviconFileError(
|
|
"Image dimensions must be between 16x16 and 48x48",
|
|
);
|
|
} else {
|
|
setData((prev) => ({
|
|
...prev,
|
|
metaFavicon: image,
|
|
}));
|
|
}
|
|
}
|
|
}
|
|
},
|
|
[setData],
|
|
);
|
|
|
|
return (
|
|
<div className="pb-5">
|
|
<LinkItem
|
|
tooltipContent="Customize how your links look when shared."
|
|
title="Custom Link Preview"
|
|
link="https://dataroom.hanzo.ai/help/article/change-social-media-cards"
|
|
enabled={enableCustomMetatag}
|
|
action={handleCustomMetatag}
|
|
resetAction={resetMetatags}
|
|
/>
|
|
|
|
{enabled && (
|
|
<motion.div
|
|
className="relative mt-4 space-y-3 rounded-md shadow-sm"
|
|
{...FADE_IN_ANIMATION_SETTINGS}
|
|
>
|
|
<div>
|
|
<div className="flex items-center justify-between">
|
|
<p className="block text-sm font-medium text-foreground">Image</p>
|
|
{fileError ? (
|
|
<p className="text-sm text-red-500">{fileError}</p>
|
|
) : null}
|
|
</div>
|
|
<label
|
|
htmlFor="image"
|
|
className="group relative mt-1 flex aspect-[1200/630] h-fit cursor-pointer flex-col items-center justify-center rounded-md border border-input bg-white shadow-sm transition-all hover:border-muted-foreground hover:bg-gray-50 hover:ring-muted-foreground dark:bg-gray-800 hover:dark:bg-transparent"
|
|
>
|
|
{false && (
|
|
<div className="absolute z-[5] flex h-full w-full items-center justify-center rounded-md bg-white">
|
|
<LoadingSpinner />
|
|
</div>
|
|
)}
|
|
<div
|
|
className="absolute z-[5] h-full w-full rounded-md"
|
|
onDragOver={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setDragActive(true);
|
|
}}
|
|
onDragEnter={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setDragActive(true);
|
|
}}
|
|
onDragLeave={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setDragActive(false);
|
|
}}
|
|
onDrop={async (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setDragActive(false);
|
|
setFileError(null);
|
|
const file = e.dataTransfer.files && e.dataTransfer.files[0];
|
|
if (file) {
|
|
if (file.size / 1024 / 1024 > 5) {
|
|
setFileError("File size too big (max 5MB)");
|
|
} else if (
|
|
file.type !== "image/png" &&
|
|
file.type !== "image/jpeg" &&
|
|
file.type !== "image/jpg"
|
|
) {
|
|
setFileError(
|
|
"File type not supported (.png or .jpg only)",
|
|
);
|
|
} else {
|
|
const image = await resizeImage(file);
|
|
setData((prev) => ({
|
|
...prev,
|
|
metaImage: image,
|
|
}));
|
|
}
|
|
}
|
|
}}
|
|
/>
|
|
<div
|
|
className={cn(
|
|
"absolute z-[3] flex h-full w-full flex-col items-center justify-center rounded-md transition-all",
|
|
dragActive &&
|
|
"cursor-copy border-2 border-black bg-gray-50 opacity-100 dark:bg-transparent",
|
|
metaImage
|
|
? "opacity-0 group-hover:opacity-100"
|
|
: "group-hover:bg-gray-50 group-hover:dark:bg-transparent",
|
|
)}
|
|
>
|
|
<ArrowUpTrayIcon
|
|
className={cn(
|
|
"h-7 w-7 text-gray-500 transition-all duration-75 group-hover:scale-110 group-active:scale-95",
|
|
dragActive ? "scale-110" : "scale-100",
|
|
)}
|
|
/>
|
|
<p className="mt-2 text-center text-sm text-gray-500">
|
|
Drag and drop or click to upload.
|
|
</p>
|
|
<p className="mt-2 text-center text-sm text-gray-500">
|
|
Recommended: 1200 x 630 pixels (max 5MB)
|
|
</p>
|
|
<span className="sr-only">OG image upload</span>
|
|
</div>
|
|
{metaImage && (
|
|
<img
|
|
src={metaImage}
|
|
alt="Preview"
|
|
className="h-full w-full rounded-md object-cover"
|
|
/>
|
|
)}
|
|
</label>
|
|
<div className="mt-1 flex rounded-md shadow-sm">
|
|
<input
|
|
id="image"
|
|
name="image"
|
|
type="file"
|
|
accept="image/png,image/jpeg,image/jpg"
|
|
className="sr-only"
|
|
onChange={onChangePicture}
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
<div className="flex items-center justify-between">
|
|
<Label htmlFor="faviconIcon">
|
|
<p className="block text-sm font-medium text-foreground">
|
|
Favicon Icon{" "}
|
|
<span className="text-sm italic text-muted-foreground">
|
|
(max 1 MB)
|
|
</span>
|
|
</p>
|
|
</Label>
|
|
{faviconFileError ? (
|
|
<p className="text-sm text-red-500">{faviconFileError}</p>
|
|
) : null}
|
|
</div>
|
|
<label
|
|
htmlFor="faviconIcon"
|
|
className="group relative mt-1 flex size-14 cursor-pointer flex-col items-center justify-center rounded-md border border-gray-300 bg-white shadow-sm transition-all hover:bg-gray-50"
|
|
style={{
|
|
backgroundImage:
|
|
"linear-gradient(45deg, #ccc 25%, transparent 25%), linear-gradient(135deg, #ccc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #ccc 75%), linear-gradient(135deg, transparent 75%, #ccc 75%)",
|
|
backgroundSize: "20px 20px",
|
|
backgroundPosition: "0 0, 10px 0, 10px -10px, 0px 10px",
|
|
}}
|
|
>
|
|
{false && (
|
|
<div className="absolute z-[5] flex h-full w-full items-center justify-center rounded-md bg-white">
|
|
<LoadingSpinner />
|
|
</div>
|
|
)}
|
|
<div
|
|
className="absolute z-[5] h-full w-full rounded-md"
|
|
onDragOver={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setFaviconDragActive(true);
|
|
}}
|
|
onDragEnter={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setFaviconDragActive(true);
|
|
}}
|
|
onDragLeave={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setFaviconDragActive(false);
|
|
}}
|
|
onDrop={async (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setFaviconDragActive(false);
|
|
setFaviconFileError(null);
|
|
const file = e.dataTransfer.files && e.dataTransfer.files[0];
|
|
if (file) {
|
|
if (file.size / 1024 / 1024 > 1) {
|
|
setFaviconFileError("File size too big (max 1MB)");
|
|
} else if (
|
|
file.type !== "image/png" &&
|
|
file.type !== "image/x-icon" &&
|
|
file.type !== "image/svg+xml"
|
|
) {
|
|
setFaviconFileError(
|
|
"File type not supported (.png, .ico, .svg only)",
|
|
);
|
|
} else {
|
|
const image = await resizeImage(file, {
|
|
width: 36,
|
|
height: 36,
|
|
quality: 1,
|
|
});
|
|
const isValidDimensions = await validateImageDimensions(
|
|
image,
|
|
16,
|
|
48,
|
|
);
|
|
if (!isValidDimensions) {
|
|
setFaviconFileError(
|
|
"Image dimensions must be between 16x16 and 48x48",
|
|
);
|
|
} else {
|
|
setData((prev) => ({
|
|
...prev,
|
|
metaFavicon: image,
|
|
}));
|
|
}
|
|
}
|
|
}
|
|
}}
|
|
/>
|
|
<div
|
|
className={`${
|
|
faviconDragActive
|
|
? "cursor-copy border-2 border-black bg-gray-50 opacity-100"
|
|
: ""
|
|
} absolute z-[3] flex h-full w-full flex-col items-center justify-center rounded-md bg-white transition-all ${
|
|
metaFavicon
|
|
? "opacity-0 group-hover:opacity-100"
|
|
: "group-hover:bg-gray-50"
|
|
}`}
|
|
>
|
|
<PlusIcon
|
|
className={`${
|
|
faviconDragActive ? "scale-110" : "scale-100"
|
|
} h-7 w-7 text-gray-500 transition-all duration-75 group-hover:scale-110 group-active:scale-95`}
|
|
/>
|
|
<span className="sr-only">OG image upload</span>
|
|
</div>
|
|
{metaFavicon && (
|
|
<img
|
|
src={metaFavicon}
|
|
alt="Preview"
|
|
className="h-full w-full rounded-md object-contain"
|
|
/>
|
|
)}
|
|
</label>
|
|
<div className="mt-1 hidden rounded-md shadow-sm">
|
|
<input
|
|
id="faviconIcon"
|
|
name="favicon"
|
|
type="file"
|
|
accept="image/png,image/x-icon,image/svg+xml"
|
|
className="sr-only"
|
|
onChange={onChangeFavicon}
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div className="flex items-center justify-between">
|
|
<p className="block text-sm font-medium text-foreground">Title</p>
|
|
<p className="text-sm text-muted-foreground">
|
|
{metaTitle?.length || 0}/120
|
|
</p>
|
|
</div>
|
|
<div className="relative mt-1 flex rounded-md shadow-sm">
|
|
{false && (
|
|
<div className="absolute flex h-full w-full items-center justify-center rounded-md border border-gray-300 bg-white">
|
|
<LoadingSpinner />
|
|
</div>
|
|
)}
|
|
<Input
|
|
name="title"
|
|
id="title"
|
|
maxLength={120}
|
|
className="focus:ring-inset"
|
|
placeholder={`Hanzo Dataroom - open-source document sharing infrastructure.`}
|
|
value={metaTitle || ""}
|
|
onChange={(e) => {
|
|
setData({ ...data, metaTitle: e.target.value });
|
|
}}
|
|
aria-invalid="true"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<div className="flex items-center justify-between">
|
|
<p className="block text-sm font-medium text-foreground">
|
|
Description
|
|
</p>
|
|
<p className="text-sm text-muted-foreground">
|
|
{metaDescription?.length || 0}/240
|
|
</p>
|
|
</div>
|
|
<div className="relative mt-1 flex rounded-md shadow-sm">
|
|
{false && (
|
|
<div className="absolute flex h-full w-full items-center justify-center rounded-md border border-gray-300 bg-white">
|
|
<LoadingSpinner />
|
|
</div>
|
|
)}
|
|
<Textarea
|
|
name="description"
|
|
id="description"
|
|
rows={3}
|
|
maxLength={240}
|
|
className="focus:ring-inset"
|
|
placeholder={`Hanzo Dataroom is an open-source document sharing infrastructure for modern teams.`}
|
|
value={metaDescription || ""}
|
|
onChange={(e) => {
|
|
setData({
|
|
...data,
|
|
metaDescription: e.target.value,
|
|
});
|
|
}}
|
|
aria-invalid="true"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</motion.div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|