Skip to content

Commit 8f35596

Browse files
committed
refactor
1 parent d4f850a commit 8f35596

5 files changed

Lines changed: 102 additions & 110 deletions

File tree

src/app/components/cookie/CookieTable.tsx

Lines changed: 9 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@ import {useGlobalContext} from "@/context/global-context.tsx"
33
import {useApplyCookie} from "@/hooks/useCookie.ts"
44
import {CookieData} from "@/types/types"
55
import {Button} from "@/components/ui/button"
6-
import {Check, Copy, FilePen, GripVertical, MoreHorizontal, Trash} from "lucide-react"
7-
import {DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger} from "@/components/ui/dropdown-menu"
6+
import {GripVertical} from "lucide-react"
87
import {ProjectAvatar} from "@/components/ui/project-avatar"
98
import {TableCell, TableHead, TableRow} from "@/components/ui/table"
109
import toast from "react-hot-toast"
10+
import ActionButtons from "@/app/components/shared/ActionButtons"
1111

1212
interface CookieTableProps {
1313
cookies: CookieData[];
@@ -74,50 +74,13 @@ export default function CookieTable({
7474
</div>
7575
</TableCell>
7676
<TableCell style={{width: COLUMN_WIDTHS.actions, paddingLeft: '16px'}}>
77-
<div className="flex items-center gap-1" onClick={(e) => e.stopPropagation()}>
78-
<DropdownMenu>
79-
<DropdownMenuTrigger asChild>
80-
<Button variant="ghost" size="icon" className="h-7 w-7">
81-
<MoreHorizontal className="h-3.5 w-3.5"/>
82-
</Button>
83-
</DropdownMenuTrigger>
84-
<DropdownMenuContent align="end">
85-
<DropdownMenuItem onClick={() => handleEdit(cookie)} className="cursor-pointer">
86-
<FilePen className="h-3.5 w-3.5 mr-2"/>
87-
Edit
88-
</DropdownMenuItem>
89-
<DropdownMenuItem
90-
className="text-destructive focus:text-destructive cursor-pointer"
91-
onClick={() => handleDeleteProfile(cookie)}
92-
>
93-
<Trash className="h-3.5 w-3.5 mr-2"/>
94-
Delete
95-
</DropdownMenuItem>
96-
</DropdownMenuContent>
97-
</DropdownMenu>
98-
<Button
99-
variant="ghost"
100-
size="icon"
101-
className="h-7 w-7"
102-
onClick={(e) => {
103-
handleCopy(cookie.value);
104-
}}
105-
title="Copy value"
106-
>
107-
<Copy className="h-3.5 w-3.5"/>
108-
</Button>
109-
<Button
110-
className={`h-7 w-7`}
111-
onClick={async (e) => {
112-
await useApplyCookie(cookie)
113-
}}
114-
variant="secondary"
115-
size="icon"
116-
title="Apply"
117-
>
118-
<Check className="h-3.5 w-3.5"/>
119-
</Button>
120-
</div>
77+
<ActionButtons
78+
onEdit={() => handleEdit(cookie)}
79+
onDelete={() => handleDeleteProfile(cookie)}
80+
onCopy={() => handleCopy(cookie.value)}
81+
onApply={async () => await useApplyCookie(cookie)}
82+
copyTitle="Copy value"
83+
/>
12184
</TableCell>
12285
</>
12386
)
Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import React from "react";
2+
import { Button } from "@/components/ui/button";
3+
import { Check, Copy, FilePen, MoreHorizontal, Trash } from "lucide-react";
4+
import {
5+
DropdownMenu,
6+
DropdownMenuContent,
7+
DropdownMenuItem,
8+
DropdownMenuTrigger
9+
} from "@/components/ui/dropdown-menu";
10+
import toast from "react-hot-toast";
11+
12+
interface ActionButtonsProps {
13+
onEdit: () => void;
14+
onDelete: () => void;
15+
onCopy: () => void;
16+
onApply: () => void;
17+
copyTitle?: string;
18+
children?: React.ReactNode;
19+
}
20+
21+
export default function ActionButtons({
22+
onEdit,
23+
onDelete,
24+
onCopy,
25+
onApply,
26+
copyTitle = "Kopyala",
27+
children
28+
}: ActionButtonsProps) {
29+
return (
30+
<div className="flex items-center gap-1" onClick={(e) => e.stopPropagation()}>
31+
<DropdownMenu>
32+
<DropdownMenuTrigger asChild>
33+
<Button variant="ghost" size="icon" className="h-7 w-7">
34+
<MoreHorizontal className="h-3.5 w-3.5" />
35+
</Button>
36+
</DropdownMenuTrigger>
37+
<DropdownMenuContent align="end">
38+
<DropdownMenuItem onClick={onEdit} className="cursor-pointer">
39+
<FilePen className="h-3.5 w-3.5 mr-2" />
40+
Edit
41+
</DropdownMenuItem>
42+
<DropdownMenuItem
43+
className="text-destructive focus:text-destructive cursor-pointer"
44+
onClick={onDelete}
45+
>
46+
<Trash className="h-3.5 w-3.5 mr-2" />
47+
Delete
48+
</DropdownMenuItem>
49+
{children}
50+
</DropdownMenuContent>
51+
</DropdownMenu>
52+
<Button
53+
variant="ghost"
54+
size="icon"
55+
className="h-7 w-7"
56+
onClick={onCopy}
57+
title={copyTitle}
58+
>
59+
<Copy className="h-3.5 w-3.5" />
60+
</Button>
61+
<Button
62+
className="h-7 w-7"
63+
onClick={onApply}
64+
variant="secondary"
65+
size="icon"
66+
title="Apply"
67+
>
68+
<Check className="h-3.5 w-3.5" />
69+
</Button>
70+
</div>
71+
);
72+
}

src/app/components/shared/ProjectFilter.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ export const ProjectFilter = ({
100100
}
101101

102102
useEffect(() => {
103-
// This hook filters data when
103+
// This hook, filters data when search term or active project changes
104104
setFilteredItems(filterItems())
105105
}, [searchTerm, activeProject, cookies, swaggers]);
106106

src/app/components/swagger/SwaggerTable.tsx

Lines changed: 9 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,11 @@
11
import DataTable from "@/app/components/shared/DataTable"
22
import {useGlobalContext} from "@/context/global-context.tsx"
33
import {SwaggerData} from "@/types/types"
4-
import {Button} from "@/components/ui/button"
5-
import {Check, Copy, FilePen, GripVertical, MoreHorizontal, Trash} from "lucide-react"
6-
import {
7-
DropdownMenu,
8-
DropdownMenuContent,
9-
DropdownMenuItem,
10-
DropdownMenuTrigger
11-
} from "@/components/ui/dropdown-menu"
4+
import {GripVertical} from "lucide-react"
125
import {ProjectAvatar} from "@/components/ui/project-avatar"
136
import {TableCell, TableHead, TableRow} from "@/components/ui/table"
147
import toast from "react-hot-toast"
8+
import ActionButtons from "@/app/components/shared/ActionButtons"
159

1610
interface SwaggerTableProps {
1711
swaggers: SwaggerData[];
@@ -71,50 +65,13 @@ export default function SwaggerTable({
7165
</div>
7266
</TableCell>
7367
<TableCell style={{width: COLUMN_WIDTHS.actions, paddingLeft: '16px'}}>
74-
<div className="flex items-center gap-1" onClick={(e) => e.stopPropagation()}>
75-
<DropdownMenu>
76-
<DropdownMenuTrigger asChild>
77-
<Button variant="ghost" size="icon" className="h-7 w-7">
78-
<MoreHorizontal className="h-3.5 w-3.5"/>
79-
</Button>
80-
</DropdownMenuTrigger>
81-
<DropdownMenuContent align="end">
82-
<DropdownMenuItem onClick={() => handleEdit(swagger)} className="cursor-pointer">
83-
<FilePen className="h-3.5 w-3.5 mr-2"/>
84-
Edit
85-
</DropdownMenuItem>
86-
<DropdownMenuItem
87-
className="text-destructive focus:text-destructive cursor-pointer"
88-
onClick={() => handleDeleteProfile(swagger)}
89-
>
90-
<Trash className="h-3.5 w-3.5 mr-2"/>
91-
Delete
92-
</DropdownMenuItem>
93-
</DropdownMenuContent>
94-
</DropdownMenu>
95-
<Button
96-
variant="ghost"
97-
size="icon"
98-
className="h-7 w-7"
99-
onClick={(e) => {
100-
handleCopy(swagger.bearerToken);
101-
}}
102-
title="Copy token"
103-
>
104-
<Copy className="h-3.5 w-3.5"/>
105-
</Button>
106-
<Button
107-
className="h-7 w-7"
108-
onClick={async (e) => {
109-
await handleApply(swagger)
110-
}}
111-
variant="secondary"
112-
size="icon"
113-
title="Apply"
114-
>
115-
<Check className="h-3.5 w-3.5"/>
116-
</Button>
117-
</div>
68+
<ActionButtons
69+
onEdit={() => handleEdit(swagger)}
70+
onDelete={() => handleDeleteProfile(swagger)}
71+
onCopy={() => handleCopy(swagger.bearerToken)}
72+
onApply={async () => await handleApply(swagger)}
73+
copyTitle="Copy token"
74+
/>
11875
</TableCell>
11976
</>
12077
)

src/context/global-context.tsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,11 @@ interface GlobalContextState {
1515

1616
cookies: CookieData[];
1717
setCookies: (cookies: CookieData[]) => void;
18-
1918
swaggers: SwaggerData[];
2019
setSwaggers: (swaggers: SwaggerData[]) => void;
2120

2221
editingCookie: CookieData | null;
2322
setEditingCookie: (cookie: CookieData | null) => void;
24-
2523
editingSwagger: SwaggerData | null;
2624
setEditingSwagger: (swagger: SwaggerData | null) => void;
2725

@@ -30,7 +28,6 @@ interface GlobalContextState {
3028

3129
handleCookieSubmit: (cookie: CookieData) => void;
3230
handleDeleteProfile: (data: CookieData | SwaggerData) => void;
33-
3431
handleSwaggerSubmit: (swagger: SwaggerData) => void;
3532

3633
animationDirection: 1 | -1;
@@ -39,21 +36,24 @@ interface GlobalContextState {
3936
projects: string[];
4037
setProjects: React.Dispatch<React.SetStateAction<string[]>>;
4138

42-
getAllProjects: () => string[];
43-
addProject: (projectName: string) => void;
39+
getAllProjects(): string[];
4440

45-
handleDeleteProject: (projectName: string) => void;
41+
addProject(projectName: string): void;
4642

47-
settings?: Settings;
48-
updateSettings?: (settings?: Partial<Settings>) => void;
43+
handleDeleteProject(projectName: string): void;
4944

50-
activeProject?: string | null;
51-
setActiveProject?: React.Dispatch<React.SetStateAction<string | null>>;
45+
settings: Settings;
46+
updateSettings(newSettings: Partial<Settings>): void;
47+
48+
activeProject: string | null;
49+
setActiveProject(projectName: string | null): void;
5250

5351
searchTerm?: string;
5452
setSearchTerm?: React.Dispatch<React.SetStateAction<string>>;
5553

56-
handleImport?: (importedData?: any) => void;
54+
clearSearchTerm(): void;
55+
56+
handleImport(importedData?: any): void;
5757
}
5858

5959
export const GlobalContext = createContext<GlobalContextState | any>(undefined);

0 commit comments

Comments
 (0)