jhynsoo/worlabel
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor: Role 변경 관리자 매니저 에디터 뷰어로 확정

Browse Source
This commit is contained in:
정현조 2024-08-29 16:05:35 +09:00
parent 72372ebecd
commit f258727684
4 changed files with 17 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/components/MemberAddModal/MemberAddForm.tsx
View File

@ -6,13 +6,14 @@ import { Input } from '../ui/input';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../ui/select'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../ui/select';
type Role = 'admin' | 'editor' | 'viewer'; type Role = 'admin' | 'manager' | 'editor' | 'viewer';
const roles: Role[] = ['admin', 'editor', 'viewer']; const roles: Role[] = ['admin', 'manager', 'editor', 'viewer'];
const roleToStr: { [key in Role]: string } = { const roleToStr: { [key in Role]: string } = {
admin: '관리자', admin: '관리자',
editor: '사용자', manager: '매니저',
editor: '에디터',
viewer: '뷰어', viewer: '뷰어',
}; };

14
frontend/src/components/MemberManageModal/MemberManageForm.tsx
View File

@ -6,17 +6,17 @@ import { Input } from '../ui/input';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../ui/select'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../ui/select';
type Role = 'admin' | 'editor' | 'viewer'; type Role = 'admin' | 'manager' | 'editor' | 'viewer';
const roles: Role[] = ['admin', 'editor', 'viewer']; const roles: Role[] = ['admin', 'manager', 'editor', 'viewer'];
const roleToStr: { [key in Role]: string } = { const roleToStr: { [key in Role]: string } = {
admin: '관리자', admin: '관리자',
manager: '매니저',
editor: '에디터', editor: '에디터',
viewer: '뷰어', viewer: '뷰어',
}; };
// Adjusted form schema to match the required Role type
const formSchema = z.object({ const formSchema = z.object({
members: z.array( members: z.array(
z.object({ z.object({
@ -50,6 +50,12 @@ export default function MemberManageForm({ members, onSubmit }: MemberManageForm
return acc; return acc;
}, {}); }, {});
const roleOrder: Role[] = ['admin', 'manager', 'editor', 'viewer'];
const sortedGroupedMembers = Object.entries(groupedMembers).sort(
([roleA], [roleB]) => roleOrder.indexOf(roleA as Role) - roleOrder.indexOf(roleB as Role)
);
return ( return (
<Form {...form}> <Form {...form}>
<form <form
@ -57,7 +63,7 @@ export default function MemberManageForm({ members, onSubmit }: MemberManageForm
className="flex flex-col gap-5" className="flex flex-col gap-5"
> >
<div className="flex w-[530px] flex-col gap-[var(--size-space-200)]"> <div className="flex w-[530px] flex-col gap-[var(--size-space-200)]">
{Object.entries(groupedMembers).map(([role, groupMembers]) => { {sortedGroupedMembers.map(([role, groupMembers]) => {
if (!groupMembers || groupMembers.length === 0) return null; if (!groupMembers || groupMembers.length === 0) return null;
return ( return (

4
frontend/src/components/MemberManageModal/index.stories.tsx
View File

@ -20,8 +20,8 @@ export const Default: Story = {
members: [ members: [
{ email: 'admin1@example.com', role: 'admin' }, { email: 'admin1@example.com', role: 'admin' },
{ email: 'admin2@example.com', role: 'admin' }, { email: 'admin2@example.com', role: 'admin' },
{ email: 'viewer1@example.com', role: 'viewer' }, { email: 'manager1@example.com', role: 'manager' },
{ email: 'viewer2@example.com', role: 'viewer' }, { email: 'manager2@example.com', role: 'manager' },
{ email: 'viewer3@example.com', role: 'viewer' }, { email: 'viewer3@example.com', role: 'viewer' },
{ email: 'editor1@example.com', role: 'editor' }, { email: 'editor1@example.com', role: 'editor' },
{ email: 'editor2@example.com', role: 'editor' }, { email: 'editor2@example.com', role: 'editor' },

2
frontend/src/components/MemberManageModal/index.tsx
View File

@ -1,7 +1,7 @@
import MemberManageForm, { MemberManageFormValues } from './MemberManageForm'; import MemberManageForm, { MemberManageFormValues } from './MemberManageForm';
import XIcon from '@/assets/icons/x.svg?react'; import XIcon from '@/assets/icons/x.svg?react';
type Role = 'admin' | 'editor' | 'viewer'; type Role = 'admin' | 'manager' | 'editor' | 'viewer';
interface Member { interface Member {
email: string; email: string;