Skip to content

Commit

Permalink
Merge pull request #2180 from decentdao/remove-payroll-components
Browse files Browse the repository at this point in the history 
`[roles-0.2.0]` Remove payroll components
  • Loading branch information
@Da-Colon
Da-Colon committed Jul 26, 2024
2 parents 9c4e173 + 13423bd commit 23254e7
Show file tree
Hide file tree
Showing 22 changed files with 27 additions and 1,170 deletions.
72 changes: 4 additions & 68 deletions src/components/pages/Roles/RoleCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,7 @@ import { Card } from '../../ui/cards/Card';
import EtherscanLink from '../../ui/links/EtherscanLink';
import Avatar from '../../ui/page/Header/Avatar';
import EditBadge from './EditBadge';
import {
RoleEditProps,
RoleProps,
SablierPayroll,
SablierVesting,
frequencyOptions,
} from './types';
import { RoleEditProps, RoleProps, SablierVesting } from './types';

export function AvatarAndRoleName({
wearerAddress,
Expand Down Expand Up @@ -69,60 +63,10 @@ export function AvatarAndRoleName({
);
}

function PayrollAndVesting({
payroll,
vesting,
}: {
payroll: SablierPayroll | undefined;
vesting: SablierVesting | undefined;
}) {
function Vesting({ vesting }: { vesting: SablierVesting | undefined }) {
const { t } = useTranslation(['roles']);
return (
<Flex flexDir="column">
{payroll && (
<Box
mt="1rem"
ml="4rem"
>
<Text
textStyle="button-small"
color="neutral-7"
>
{t('payroll')}
</Text>
<Flex
textStyle="body-base"
color="white-0"
gap="0.25rem"
alignItems="center"
my="0.5rem"
>
<Image
src={payroll.asset.logo}
fallbackSrc="/images/coin-icon-default.svg"
alt={payroll.asset.symbol}
w="1.25rem"
h="1.25rem"
/>
{payroll.amount.value}
<EtherscanLink
color="white-0"
_hover={{ bg: 'transparent' }}
textStyle="body-base"
padding={0}
borderWidth={0}
value={payroll.asset.address}
type="token"
wordBreak="break-word"
>
{payroll.asset.symbol}
</EtherscanLink>
<Text>
{'/'} {t(`${frequencyOptions[payroll.paymentFrequency]}Short`)}
</Text>
</Flex>
</Box>
)}
{vesting && (
<Box
mt="0.25rem"
Expand Down Expand Up @@ -174,7 +118,6 @@ function PayrollAndVesting({
export function RoleCard({
name,
wearerAddress,
payroll,
vesting,
editStatus,
handleRoleClick,
Expand All @@ -201,18 +144,14 @@ export function RoleCard({
/>
</Flex>
</Flex>
<PayrollAndVesting
payroll={payroll}
vesting={vesting}
/>
<Vesting vesting={vesting} />
</Card>
);
}

export function RoleCardEdit({
name,
wearerAddress,
payroll,
vesting,
editStatus,
handleRoleClick,
Expand All @@ -238,10 +177,7 @@ export function RoleCardEdit({
/>
</Flex>
</Flex>
<PayrollAndVesting
payroll={payroll}
vesting={vesting}
/>
<Vesting vesting={vesting} />
</Card>
);
}
11 changes: 3 additions & 8 deletions src/components/pages/Roles/RolesDetailsDrawer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ import { useTranslation } from 'react-i18next';
import { Hex, getAddress } from 'viem';
import { useGetDAOName } from '../../../hooks/DAO/useGetDAOName';
import useAvatar from '../../../hooks/utils/useAvatar';
import PayrollAndVesting from '../../../pages/daos/[daoAddress]/roles/details/PayrollAndVesting';
import Vesting from '../../../pages/daos/[daoAddress]/roles/details/PayrollAndVesting';
import { useFractal } from '../../../providers/App/AppProvider';
import { useNetworkConfig } from '../../../providers/NetworkConfig/NetworkConfigProvider';
import Avatar from '../../ui/page/Header/Avatar';
import { SablierPayroll, SablierVesting } from './types';
import { SablierVesting } from './types';

function RoleAndDescriptionLabel({ label, icon }: { label: string; icon: React.ElementType }) {
return (
Expand All @@ -44,7 +44,6 @@ interface RoleDetailsDrawerProps {
wearer: string;
description: string;
};
payroll?: SablierPayroll;
vesting?: SablierVesting;
onOpen?: () => void;
onClose: () => void;
Expand All @@ -57,7 +56,6 @@ export default function RolesDetailsDrawer({
onClose,
isOpen = true,
onEdit,
payroll,
vesting,
}: RoleDetailsDrawerProps) {
const {
Expand Down Expand Up @@ -163,10 +161,7 @@ export default function RolesDetailsDrawer({
</GridItem>
</Grid>
{/* @todo: proper styling here */}
<PayrollAndVesting
payroll={payroll}
vesting={vesting}
/>
<Vesting vesting={vesting} />
</DrawerBody>
</DrawerContent>
</Drawer>
Expand Down
9 changes: 2 additions & 7 deletions src/components/pages/Roles/RolesDetailsDrawerMobile.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { useFractal } from '../../../providers/App/AppProvider';
import { useRolesState } from '../../../state/useRolesState';
import DraggableDrawer from '../../ui/containers/DraggableDrawer';
import { AvatarAndRoleName } from './RoleCard';
import { SablierPayroll, SablierVesting } from './types';
import { SablierVesting } from './types';

interface RoleDetailsDrawerMobileProps {
roleHat: {
Expand All @@ -16,7 +16,6 @@ interface RoleDetailsDrawerMobileProps {
wearer: string;
description: string;
};
payroll?: SablierPayroll;
vesting?: SablierVesting;
onOpen?: () => void;
onClose?: () => void;
Expand All @@ -30,7 +29,6 @@ export default function RolesDetailsDrawerMobile({
onOpen,
isOpen = true,
onEdit,
payroll,
vesting,
}: RoleDetailsDrawerMobileProps) {
const {
Expand Down Expand Up @@ -93,10 +91,7 @@ export default function RolesDetailsDrawerMobile({
px="1rem"
mb="1.5rem"
>
<PayrollAndVesting
payroll={payroll}
vesting={vesting}
/>
<PayrollAndVesting vesting={vesting} />
</Box>
</DraggableDrawer>
);
Expand Down
77 changes: 2 additions & 75 deletions src/components/pages/Roles/RolesTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,14 +12,7 @@ import EtherscanLink from '../../ui/links/EtherscanLink';
import Avatar from '../../ui/page/Header/Avatar';
import EditBadge from './EditBadge';
import { RoleCardLoading, RoleCardNoRoles } from './RolePageCard';
import {
RoleEditProps,
RoleFormValues,
RoleProps,
SablierPayroll,
SablierVesting,
frequencyOptions,
} from './types';
import { RoleEditProps, RoleFormValues, RoleProps, SablierVesting } from './types';

function RolesHeader({ addHiddenColumn }: { addHiddenColumn?: boolean }) {
const { t } = useTranslation(['roles']);
Expand All @@ -38,7 +31,6 @@ function RolesHeader({ addHiddenColumn }: { addHiddenColumn?: boolean }) {
>
<Th>{t('role')}</Th>
<Th>{t('member')}</Th>
<Th>{t('payroll')}</Th>
<Th>{t('vesting')}</Th>
{addHiddenColumn && <Th w="10%" />}
</Tr>
Expand Down Expand Up @@ -130,59 +122,6 @@ function MemberColumn({ wearerAddress }: { wearerAddress: string | undefined })
);
}

function PayrollColumn({ payroll }: { payroll: SablierPayroll | undefined }) {
const { t } = useTranslation(['roles', 'daoCreate']);
return (
<Td>
<Flex flexDir="column">
{payroll ? (
<Box>
<Flex
alignItems="center"
gap="0.25rem"
my="0.5rem"
>
<Image
src={payroll.asset.logo}
fallbackSrc="/images/coin-icon-default.svg"
alt={payroll.asset.symbol}
w="1.25rem"
h="1.25rem"
/>
{payroll.amount.value}
<EtherscanLink
color="white-0"
_hover={{ bg: 'transparent' }}
textStyle="body-base"
padding={0}
borderWidth={0}
value={payroll.asset.address}
type="token"
wordBreak="break-word"
>
{payroll.asset.symbol}
</EtherscanLink>
<Text
color="white-0"
textStyle="body-base"
>
{'/'} {t(`${frequencyOptions[payroll.paymentFrequency]}Short`)}
</Text>
</Flex>
</Box>
) : (
<Text
textStyle="body-base"
color="neutral-6"
>
{t('n/a', { ns: 'daoCreate' })}
</Text>
)}
</Flex>
</Td>
);
}

function VestingColumn({ vesting }: { vesting: SablierVesting | undefined }) {
const { t } = useTranslation(['daoCreate']);
return (
Expand Down Expand Up @@ -233,14 +172,7 @@ function VestingColumn({ vesting }: { vesting: SablierVesting | undefined }) {
);
}

export function RolesRow({
name,
wearerAddress,
payroll,
vesting,
handleRoleClick,
hatId,
}: RoleProps) {
export function RolesRow({ name, wearerAddress, vesting, handleRoleClick, hatId }: RoleProps) {
return (
<Tr
sx={{
Expand All @@ -256,7 +188,6 @@ export function RolesRow({
>
<RoleNameColumn roleName={name} />
<MemberColumn wearerAddress={wearerAddress} />
<PayrollColumn payroll={payroll} />
<VestingColumn vesting={vesting} />
</Tr>
);
Expand All @@ -266,7 +197,6 @@ export function RolesRowEdit({
name,
wearerAddress,
editStatus,
payroll,
vesting,
handleRoleClick,
}: RoleEditProps) {
Expand All @@ -285,7 +215,6 @@ export function RolesRowEdit({
>
<RoleNameEditColumn roleName={name} />
<MemberColumn wearerAddress={wearerAddress} />
<PayrollColumn payroll={payroll} />
<VestingColumn vesting={vesting} />
<Td w="10%">
<EditBadge editStatus={editStatus} />
Expand Down Expand Up @@ -331,7 +260,6 @@ export function RolesTable({
name={role.name}
wearerAddress={role.wearer}
handleRoleClick={handleRoleClick}
payroll={role.payroll}
vesting={role.vesting}
/>
))}
Expand Down Expand Up @@ -382,7 +310,6 @@ export function RolesEditTable({ handleRoleClick }: { handleRoleClick: (hatId: H
handleRoleClick(role.id);
}}
editStatus={role.editedRole?.status}
payroll={role.payroll}
vesting={role.vesting}
/>
))}
Expand Down
2 changes: 1 addition & 1 deletion src/components/pages/Roles/forms/RoleFormAssetSelector.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import LabelWrapper from '../../../ui/forms/LabelWrapper';
import { EaseOutComponent } from '../../../ui/utils/EaseOutComponent';
import { RoleFormValues } from '../types';

export function AssetSelector({ formName }: { formName: 'vesting' | 'payroll' }) {
export function AssetSelector({ formName }: { formName: 'vesting' }) {
const { t } = useTranslation(['roles', 'treasury', 'modals']);
const {
treasury: { assetsFungible },
Expand Down
3 changes: 0 additions & 3 deletions src/components/pages/Roles/forms/RoleFormCreateProposal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -127,7 +127,6 @@ export default function RoleFormCreateProposal({ close }: { close: () => void })
setDrawerViewingRole(role);
}}
editStatus={role.editedRole?.status}
payroll={role.payroll}
vesting={role.vesting}
/>
))}
Expand Down Expand Up @@ -158,7 +157,6 @@ export default function RoleFormCreateProposal({ close }: { close: () => void })
isOpen={drawerViewingRole !== undefined}
onClose={handleCloseDrawer}
onEdit={handleEditRoleClick}
payroll={drawerViewingRole.payroll}
vesting={drawerViewingRole.vesting}
/>
</Show>
Expand All @@ -168,7 +166,6 @@ export default function RoleFormCreateProposal({ close }: { close: () => void })
isOpen={drawerViewingRole !== undefined}
onClose={handleCloseDrawer}
onEdit={handleEditRoleClick}
payroll={drawerViewingRole.payroll}
vesting={drawerViewingRole.vesting}
/>
</Show>
Expand Down
Loading

0 comments on commit 23254e7

Please sign in to comment.