v3: src/ is documented like api/ and shared/, and the reference covers the whole repository — the frontend had no module docs, JSDoc on some components and hooks and not on others, props typed inline in half the components and in private interfaces in the rest, // comments on declarations, and no return types on 147 exported functions, so deno doc --lint over src/ found 637 errors. The rule api/ follows is applied to every non-test module of src/: a /** … @module */ block, JSDoc on every export and every field of an exported interface, /** */ for declarations and // for notes, verbs for functions ("Renders…" for a component), parameters named in the prose, {@link} only for symbols in scope, and a page's JSDoc names its route and who may see it (App.tsx's module doc lists the route table). For deno doc to show them, every exported function states its return type: components React.JSX.Element (or | null, or a portal), memo and forwardRef components their exotic types, contexts React.Context<…>, and a hook returning several things a documented Use<Name>Result interface (useAuth, useRequiredAuth, useFading, useEmojiTrigger, useMentionAutocomplete, useDumpCardLink, usePlayRichContent; FeedCacheResult, YouTubePlaylistControls and UseApiFormReturn are renamed to match). Every component that takes props takes an exported, documented <Name>Props interface — the 64 inline prop types are lifted into one, DumpFeed gets DumpFeedProps extending MainFeedProps. React types go through the global React namespace: the four default imports of react are gone, since deno doc can't follow them. Two duplicates go too: useMentionAutocomplete's UserResult was shared/'s UserSuggestion, and JournalCard re-exported JournalShape for no one; i18n.ts no longer re-exports Lingui's i18n, which its three users now import from @lingui/core. deno task doc and doc:lint now take src/ (but its tests and the generated locales), the index page gains a Frontend section linking every module by layer and domain, mod.test.ts walks src/ as well, and the docs workflow runs on changes to src/. deno doc doesn't document npm packages, so it takes a type imported from one — react-hook-form's FieldValues in the form fields, frimousse's SkinTone — for a private one; doc:lint now goes through doc-lint.ts, which fails on every diagnostic but those, 25 of them. The README states the frontend's part of the rule. No behaviour changes; 205 backend and 628 frontend tests pass, and tsc, deno check and deno lint are clean.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Binary file not shown.
@@ -1,18 +1,30 @@
|
||||
/**
|
||||
* A dump form's category picker.
|
||||
*
|
||||
* @module
|
||||
*/
|
||||
|
||||
import { Trans } from "@lingui/react/macro";
|
||||
import { useCategories } from "../../hooks/category/useCategories.ts";
|
||||
|
||||
/** The props of {@link CategorySelect}. */
|
||||
export interface CategorySelectProps {
|
||||
/** The ids of the categories chosen. */
|
||||
selected: Set<string>;
|
||||
/** Called with the id of a category toggled. */
|
||||
onToggle: (id: string) => void;
|
||||
/** Whether the chips are disabled. */
|
||||
disabled?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* Multi-select of categories rendered as toggle chips. Renders nothing when no
|
||||
* categories are configured, so dump forms stay unchanged until an admin adds
|
||||
* the first category.
|
||||
* Renders a multi-select of categories as toggle chips. Renders nothing when
|
||||
* no categories are configured, so dump forms stay unchanged until an admin
|
||||
* adds the first category.
|
||||
*/
|
||||
export function CategorySelect(
|
||||
{ selected, onToggle, disabled }: {
|
||||
selected: Set<string>;
|
||||
onToggle: (id: string) => void;
|
||||
disabled?: boolean;
|
||||
},
|
||||
) {
|
||||
{ selected, onToggle, disabled }: CategorySelectProps,
|
||||
): React.JSX.Element | null {
|
||||
const { categories } = useCategories();
|
||||
if (categories.length === 0) return null;
|
||||
|
||||
|
||||
@@ -1,3 +1,9 @@
|
||||
/**
|
||||
* The feed's category switcher.
|
||||
*
|
||||
* @module
|
||||
*/
|
||||
|
||||
import {
|
||||
type CSSProperties,
|
||||
useEffect,
|
||||
@@ -12,15 +18,16 @@ import { useCategories } from "../../hooks/category/useCategories.ts";
|
||||
import { DEFAULT_FEED_TAB } from "../../config/feedTabs.ts";
|
||||
|
||||
/**
|
||||
* Header dropdown that switches the feed scope between "All" and a category,
|
||||
* preserving the active feed tab (e.g. /music/new → /cinema/new). Rendered as
|
||||
* the leading item of the feed-sort tab row so it reads as part of the bar.
|
||||
* Renders the header dropdown that switches the feed scope between "All" and a
|
||||
* category, preserving the active feed tab (e.g. /music/new → /cinema/new).
|
||||
* Rendered as the leading item of the feed-sort tab row so it reads as part of
|
||||
* the bar.
|
||||
*
|
||||
* A custom popover (not a native <select>) keeps it on-theme; the menu uses
|
||||
* fixed positioning so the row's `overflow-x: auto` can't clip it. `~` is the
|
||||
* sentinel value for the all-categories feed. Hidden when no categories exist.
|
||||
*/
|
||||
export function CategorySwitcher() {
|
||||
export function CategorySwitcher(): React.JSX.Element | null {
|
||||
const { categories } = useCategories();
|
||||
const navigate = useNavigate();
|
||||
const { categorySlug, feedTab } = useParams();
|
||||
|
||||
Reference in New Issue
Block a user