pippinmole/ghost

public

Source code of Ghost - On Ghost

fix build errors23fd7e05 days ago145 lines · 4.3 KB

1	"use client";
2
3	import { useRef, type ReactNode } from "react";
4	import { useDebouncer }
5	import Form from "next/form
6	import { Plus, Search
7
8	import { NewRepositoryDialog }
9	import { RepositoryCard }
10	import { Button }
11	import {
12	InputGroup,
13	InputGroupAddon,
14	InputGroupInput,
15	} from "@/components/ui/input-group";
16	import { Tabs, TabsContent
17
18	import type { components
19	import {
20	Empty,
21	EmptyDescription,
22	EmptyHeader,
23	EmptyTitle,
24	} from "@/components/ui/empty";
25
26	type RepositoryEntity
27
28	export function ProfileTabs({
29	username,
30	isViewer,
31	owners,
32	defaultTab,
33	repositories,
34	query,
35	pagination,
36	overview,
37	extraTabs = [],
38	}: {
39	username: string
40	isViewer: boolean
41	owners: string
42	defaultTab: "overview
43	repositories: RepositoryEntity
44	query: string
45	/** Rendered on the server from the page's cursor. */
46	pagination: ReactNode
47	/** Rendered on the server: the profile README, or its empty state. */
48	overview: ReactNode
49	/** After Repositories: a user's organizations, or an organization's people and teams. */
50	extraTabs?: {
51	}) {
52	const filter =
53	const submitFilter =
54	wait: 300,
55	});
56
57	return (
58	<Tabs defaultValue={
59	<TabsList>
60	<TabsTrigger value="
61	<TabsTrigger value="
62	{extraTabs.map((
63	<TabsTrigger key={
64	{label}
65	</TabsTrigger>
66	))}
67	</TabsList>
68
69	<TabsContent value="
70	{overview}
71	</TabsContent>
72
73	<TabsContent value="
74	<div className="flex flex-wrap items-center gap-2
75	{/* Submitting drops the cursor, so a new filter always starts from the first page. */
76	<Form
77	ref={filter}
78	action={`/${username
79	replace
80	scroll={false}
81	className="flex-1"
82	>
83	<input type="hidden
84	<InputGroup>
85	<InputGroupAddon>
86	<Search />
87	</InputGroupAddon>
88	<InputGroupInput
89	type="search"
90	name="q"
91	placeholder="Find a repository"
92	aria-label="Find a repository"
93	defaultValue={query}
94	onChange={() =>
95	/>
96	</InputGroup>
97	</Form>
98
99	{isViewer && (
100	<NewRepositoryDialog owners={
101	<Button>
102	<Plus data-icon="
103	New repository
104	</Button>
105	</NewRepositoryDialog>
106	)}
107	</div>
108
109	{repositories.length >
110	<div className="flex flex-col border-t
111	{repositories.map((
112	<RepositoryCard
113	key={repository.id
114	repository={{ ...
115	/>
116	))}
117	</div>
118	) : (
119	<Empty className="
120	<EmptyHeader>
121	<EmptyTitle>
122	{query ? "No matching repositories
123	</EmptyTitle>
124	<EmptyDescription>
125	{query
126	? "Try a different search term."
127	: isViewer
128	? "Create your first repository to start tracking a project."
129	: `${username} hasn't published any repositories.
130	</EmptyDescription>
131	</EmptyHeader>
132	</Empty>
133	)}
134
135	{pagination}
136	</TabsContent>
137
138	{extraTabs.map((
139	<TabsContent key={
140	{content}
141	</TabsContent>
142	))}
143	</Tabs>
144	);
145	}