Skip to content

Commit

Permalink
refactor(ui): better variable names
Browse files Browse the repository at this point in the history
  • Loading branch information
@bouassaba
bouassaba committed Nov 30, 2024
1 parent 7a4bf57 commit 5fb5a0b
Show file tree
Hide file tree
Showing 2 changed files with 73 additions and 75 deletions.
12 changes: 6 additions & 6 deletions ui/src/components/sharing/sharing-groups.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ const SharingGroups = () => {
const dispatch = useAppDispatch()
const selection = useAppSelector((state) => state.ui.files.selection)
const mutateFiles = useAppSelector((state) => state.ui.files.mutate)
const [isGrantLoading, setIsGrantLoading] = useState(false)
const [isGranting, setIsGranting] = useState(false)
const [revokedPermission, setRevokedPermission] = useState<string>()
const [group, setGroup] = useState<Group>()
const [permission, setPermission] = useState<string>()
Expand All @@ -77,23 +77,23 @@ const SharingGroups = () => {
const handleGrantPermission = useCallback(async () => {
if (group && permission) {
try {
setIsGrantLoading(true)
setIsGranting(true)
await FileAPI.grantGroupPermission({
ids: selection,
groupId: group.id,
permission: permission,
permission,
})
await mutateFiles?.()
if (isSingleSelection) {
await mutatePermissions()
}
setGroup(undefined)
setIsGrantLoading(false)
setIsGranting(false)
if (!isSingleSelection) {
dispatch(sharingModalDidClose())
}
} catch {
setIsGrantLoading(false)
setIsGranting(false)
}
}
}, [
Expand Down Expand Up @@ -153,7 +153,7 @@ const SharingGroups = () => {
<Button
leftIcon={<IconCheck />}
colorScheme="blue"
isLoading={isGrantLoading}
isLoading={isGranting}
isDisabled={!group || !permission}
onClick={() => handleGrantPermission()}
>
Expand Down
136 changes: 67 additions & 69 deletions ui/src/components/sharing/sharing-users.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ const SharingUsers = () => {
const dispatch = useAppDispatch()
const selection = useAppSelector((state) => state.ui.files.selection)
const mutateFiles = useAppSelector((state) => state.ui.files.mutate)
const [isGrantLoading, setIsGrantLoading] = useState(false)
const [isGranting, setIsGranting] = useState(false)
const [revokedPermission, setRevokedPermission] = useState<string>()
const [user, setUser] = useState<User>()
const [permission, setPermission] = useState<string>()
Expand All @@ -84,23 +84,23 @@ const SharingUsers = () => {
return
}
try {
setIsGrantLoading(true)
setIsGranting(true)
await FileAPI.grantUserPermission({
ids: selection,
userId: user.id,
permission: permission,
permission,
})
await mutateFiles?.()
if (isSingleSelection) {
await mutatePermissions()
}
setUser(undefined)
setIsGrantLoading(false)
setIsGranting(false)
if (!isSingleSelection) {
dispatch(sharingModalDidClose())
}
} catch {
setIsGrantLoading(false)
setIsGranting(false)
}
}, [
fileId,
Expand Down Expand Up @@ -183,7 +183,7 @@ const SharingUsers = () => {
<Button
leftIcon={<IconCheck />}
colorScheme="blue"
isLoading={isGrantLoading}
isLoading={isGranting}
isDisabled={!user || !permission}
onClick={() => handleGrantPermission()}
>
Expand All @@ -205,72 +205,70 @@ const SharingUsers = () => {
</div>
) : null}
{permissions && permissions.length > 0 ? (
<>
<Table>
<Thead>
<Tr>
<Th>User</Th>
<Th>Permission</Th>
<Th />
</Tr>
</Thead>
<Tbody>
{permissions.map((p) => (
<Tr key={p.id}>
<Td className={cx('p-1')}>
<div
<Table>
<Thead>
<Tr>
<Th>User</Th>
<Th>Permission</Th>
<Th />
</Tr>
</Thead>
<Tbody>
{permissions.map((p) => (
<Tr key={p.id}>
<Td className={cx('p-1')}>
<div
className={cx(
'flex',
'flex-row',
'items-center',
'gap-1',
)}
>
<Avatar
name={p.user.fullName}
src={
p.user.picture
? getPictureUrlById(p.user.id, p.user.picture, {
organizationId: workspace?.organization.id,
})
: undefined
}
size="sm"
className={cx(
'flex',
'flex-row',
'items-center',
'gap-1',
'w-[40px]',
'h-[40px]',
'border',
'border-gray-300',
'dark:border-gray-700',
)}
>
<Avatar
name={p.user.fullName}
src={
p.user.picture
? getPictureUrlById(p.user.id, p.user.picture, {
organizationId: workspace?.organization.id,
})
: undefined
}
size="sm"
className={cx(
'w-[40px]',
'h-[40px]',
'border',
'border-gray-300',
'dark:border-gray-700',
)}
/>
<div className={cx('flex', 'flex-col', 'gap-0.5')}>
<Text noOfLines={1}>{p.user.fullName}</Text>
<span className={cx('text-gray-500')}>
{p.user.email}
</span>
</div>
</div>
</Td>
<Td>
<Badge>{p.permission}</Badge>
</Td>
<Td className={cx('text-end')}>
<IconButton
icon={<IconDelete />}
colorScheme="red"
title="Revoke user permission"
aria-label="Revoke user permission"
isLoading={revokedPermission === p.id}
isDisabled={me?.id === p.user.id}
onClick={() => handleRevokePermission(p)}
/>
</Td>
</Tr>
))}
</Tbody>
</Table>
</>
<div className={cx('flex', 'flex-col', 'gap-0.5')}>
<Text noOfLines={1}>{p.user.fullName}</Text>
<span className={cx('text-gray-500')}>
{p.user.email}
</span>
</div>
</div>
</Td>
<Td>
<Badge>{p.permission}</Badge>
</Td>
<Td className={cx('text-end')}>
<IconButton
icon={<IconDelete />}
colorScheme="red"
title="Revoke user permission"
aria-label="Revoke user permission"
isLoading={revokedPermission === p.id}
isDisabled={me?.id === p.user.id}
onClick={() => handleRevokePermission(p)}
/>
</Td>
</Tr>
))}
</Tbody>
</Table>
) : null}
</>
) : null}
Expand Down

0 comments on commit 5fb5a0b

Please sign in to comment.