* feat(admin): add backup manager UI with 1-click restore * feat(admin): collapse older backup entries by default * fix(theme): isolate admin layout, instant DOM theme updates, and add Light/Dark mode toggle * feat(admin): replace text controls for Photo Frame and Hero Style with visual preview cards * fix(admin): define missing CSS rules for button system (.btn, .preset-btn) * feat(admin): redesign theme settings with segmented mode toggle, accent color swatches, and custom iOS-style toggle cards * feat(admin): upgrade all settings tabs with visual grid previews, Google SEO snippet preview, and toggle cards * feat(admin): overhaul Pages Builder UX with slide-over drawer, card hover badges, real-time search, and floating save bar * fix(admin): remove leftover dangling syntax snippet in PageBuilder.tsx * fix(admin): add position: relative to subpage-tile so hover overlay is contained inside the tile * style(admin): replace all emojis with clean Leica-style vector SVG icons * fix(types): extend IconProps with SVGProps to allow style prop on Leica SVG icons * feat(admin): add subpage live-preview, privacy analytics, and asset protection settings * fix(typecheck): fix AlbumEntry property access in subpage drawer preview mode * fix(types): fix ImmichAlbumInfo property names thumbnailAssetId and albumName in PageBuilder.tsx * fix(types): add protection and watermark optional properties to AppConfig interface * feat(settings): add toggle for disabling analytics tracking (defaults to enabled) * feat(ux): show status banner when analytics tracking is disabled + add live sync indicator * feat(watermark): render customizable watermark overlay on Lightbox images + rename section to Portfolio Features & Modules * fix(types): import type LightboxWatermark in PhotoGrid.tsx * fix(types): destructure watermark prop in PhotoGrid function signature * feat(seo): add configurable subpage title template and metadata descriptions * feat(seo): add generateMetadata to about page for title template support * feat(proofing): add client proofing, favorites selection, compact URL bitmasking, and export modal * feat(essay): add Photo Essay storytelling mode with RSC markdown parser and fullbleed/pair layouts * feat(subpages): add page enabled toggle to deactivate subpages without deleting them * feat(admin): add visual essay block builder for photo essay storytelling pages * security: add Trivy container scan to Docker publish workflow Scans the built image for CRITICAL/HIGH CVEs on every release and uploads results to the GitHub Security tab. Non-blocking for now (exit-code 0) so releases aren't gated on findings. Also documents the scan and existing Dependabot coverage in the README. --------- Co-authored-by: ralksta <ralksta@users.noreply.github.com>
153 lines
4.2 KiB
TypeScript
153 lines
4.2 KiB
TypeScript
'use client';
|
|
|
|
import React, { createContext, useContext, useState, useEffect } from 'react';
|
|
import { encodeProofBitmask, decodeProofBitmask } from '@/lib/proofing';
|
|
|
|
interface ProofingContextType {
|
|
favorites: Set<string>;
|
|
toggleFavorite: (token: string) => void;
|
|
isFavorite: (token: string) => boolean;
|
|
clearFavorites: () => void;
|
|
isFilterActive: boolean;
|
|
setIsFilterActive: React.Dispatch<React.SetStateAction<boolean>>;
|
|
isModalOpen: boolean;
|
|
setIsModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
|
getProofingUrl: () => string;
|
|
getFormattedList: () => string;
|
|
allowMailto: boolean;
|
|
}
|
|
|
|
const ProofingContext = createContext<ProofingContextType | null>(null);
|
|
|
|
export function ProofingProvider({
|
|
children,
|
|
albumTokens = [],
|
|
albumName = 'Gallery',
|
|
allowMailto = true,
|
|
}: {
|
|
children: React.ReactNode;
|
|
albumTokens?: string[];
|
|
albumName?: string;
|
|
allowMailto?: boolean;
|
|
}) {
|
|
const [favorites, setFavorites] = useState<Set<string>>(new Set());
|
|
const [isFilterActive, setIsFilterActive] = useState(false);
|
|
const [isModalOpen, setIsModalOpen] = useState(false);
|
|
|
|
const storageKey = `folio_fav_${albumName.toLowerCase().replace(/[^a-z0-9]+/g, '-')}`;
|
|
|
|
// Hydrate from localStorage and URL query params on mount
|
|
useEffect(() => {
|
|
try {
|
|
const saved = localStorage.getItem(storageKey);
|
|
const initialSet = new Set<string>();
|
|
if (saved) {
|
|
const parsed = JSON.parse(saved);
|
|
if (Array.isArray(parsed)) {
|
|
parsed.forEach((t) => initialSet.add(t));
|
|
}
|
|
}
|
|
|
|
// Check URL query param ?proof=...
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const proofCode = urlParams.get('proof');
|
|
if (proofCode && albumTokens.length > 0) {
|
|
const decodedIndices = decodeProofBitmask(proofCode, albumTokens.length);
|
|
decodedIndices.forEach((idx) => {
|
|
if (albumTokens[idx]) {
|
|
initialSet.add(albumTokens[idx]);
|
|
}
|
|
});
|
|
}
|
|
|
|
setFavorites(initialSet);
|
|
} catch (e) {
|
|
console.error('Failed to load favorites', e);
|
|
}
|
|
}, [storageKey, albumTokens]);
|
|
|
|
const toggleFavorite = (token: string) => {
|
|
setFavorites((prev) => {
|
|
const next = new Set(prev);
|
|
if (next.has(token)) {
|
|
next.delete(token);
|
|
} else {
|
|
next.add(token);
|
|
}
|
|
try {
|
|
localStorage.setItem(storageKey, JSON.stringify(Array.from(next)));
|
|
} catch (e) {
|
|
console.error('Failed to save favorites', e);
|
|
}
|
|
return next;
|
|
});
|
|
};
|
|
|
|
const isFavorite = (token: string) => favorites.has(token);
|
|
|
|
const clearFavorites = () => {
|
|
setFavorites(new Set());
|
|
try {
|
|
localStorage.removeItem(storageKey);
|
|
} catch (e) {
|
|
console.error('Failed to clear favorites', e);
|
|
}
|
|
};
|
|
|
|
const getProofingUrl = () => {
|
|
if (albumTokens.length === 0 || favorites.size === 0) {
|
|
return typeof window !== 'undefined' ? window.location.href : '';
|
|
}
|
|
const indices: number[] = [];
|
|
albumTokens.forEach((token, index) => {
|
|
if (favorites.has(token)) {
|
|
indices.push(index);
|
|
}
|
|
});
|
|
const code = encodeProofBitmask(indices);
|
|
const url = new URL(typeof window !== 'undefined' ? window.location.href : 'http://localhost');
|
|
if (code) {
|
|
url.searchParams.set('proof', code);
|
|
} else {
|
|
url.searchParams.delete('proof');
|
|
}
|
|
return url.toString();
|
|
};
|
|
|
|
const getFormattedList = () => {
|
|
const selectedIndices: number[] = [];
|
|
albumTokens.forEach((token, index) => {
|
|
if (favorites.has(token)) {
|
|
selectedIndices.push(index + 1);
|
|
}
|
|
});
|
|
if (selectedIndices.length === 0) return `${albumName}: No photos selected.`;
|
|
return `${albumName} — Selected Photos (${selectedIndices.length}): #${selectedIndices.join(', #')}`;
|
|
};
|
|
|
|
return (
|
|
<ProofingContext.Provider
|
|
value={{
|
|
favorites,
|
|
toggleFavorite,
|
|
isFavorite,
|
|
clearFavorites,
|
|
isFilterActive,
|
|
setIsFilterActive,
|
|
isModalOpen,
|
|
setIsModalOpen,
|
|
getProofingUrl,
|
|
getFormattedList,
|
|
allowMailto,
|
|
}}
|
|
>
|
|
{children}
|
|
</ProofingContext.Provider>
|
|
);
|
|
}
|
|
|
|
export function useProofing() {
|
|
const context = useContext(ProofingContext);
|
|
return context;
|
|
}
|