diff --git a/packages/i18n/locales/en/translation.json b/packages/i18n/locales/en/translation.json index 5bec38865..04d58c3cd 100644 --- a/packages/i18n/locales/en/translation.json +++ b/packages/i18n/locales/en/translation.json @@ -695,7 +695,8 @@ "activeThresholdDescription": "The amount of voting power that needs to be staked in order for the DAO to become active (i.e. proposal creation is allowed).", "addCw20ToTreasuryActionDescription": "Display the DAO's balance of a CW20 token in the treasury view.", "addCw721ToTreasuryActionDescription": "Display the NFTs owned by the DAO from a CW721 NFT collection in the treasury view.", - "addedToDaoFollowPrompt": "This DAO has added you as a member. Follow it to receive updates.", + "addedToDaoFollowPrompt_withTimestamp": "You were added as a member to this DAO on {{timestamp}}. Follow it to receive updates.", + "addedToDaoFollowPrompt_withoutTimestamp": "You were added as a member to this DAO. Follow it to receive updates.", "advancedVotingConfigWarning": "These are advanced features. If you configure them without fully understanding how they work, you can lock your DAO, making it impossible for proposals to pass.", "allAccountsCreated": "All accounts have been created.", "andNumMore": "and {{count}} more", diff --git a/packages/stateful/components/inbox/InboxMainItemRenderer.tsx b/packages/stateful/components/inbox/InboxMainItemRenderer.tsx index 562009af4..92146fbc6 100644 --- a/packages/stateful/components/inbox/InboxMainItemRenderer.tsx +++ b/packages/stateful/components/inbox/InboxMainItemRenderer.tsx @@ -1,7 +1,8 @@ +import { Done } from '@mui/icons-material' import { ComponentType, useCallback } from 'react' import { useTranslation } from 'react-i18next' -import { WarningCard } from '@dao-dao/stateless' +import { IconButton, Tooltip, WarningCard } from '@dao-dao/stateless' import { InboxItemRendererProps, InboxItemType, @@ -19,7 +20,23 @@ export const InboxMainItemRenderer = ({ item }: InboxMainItemRendererProps) => { const Renderer = ITEM_RENDERER_MAP[item.type] return Renderer ? ( - +
+
+ +
+ + +
+ +
+
+
) : ( ) diff --git a/packages/stateful/components/inbox/renderers/JoinedDao.tsx b/packages/stateful/components/inbox/renderers/JoinedDao.tsx index 0e1d2e612..88f4a79c5 100644 --- a/packages/stateful/components/inbox/renderers/JoinedDao.tsx +++ b/packages/stateful/components/inbox/renderers/JoinedDao.tsx @@ -6,10 +6,13 @@ import { InboxItemRendererProps, InboxItemTypeJoinedDaoData, } from '@dao-dao/types' +import { formatLongDateTime } from '@dao-dao/utils' import { useFollowingDaos } from '../../../hooks' +import { EntityDisplay } from '../../EntityDisplay' export const JoinedDaoRenderer = ({ + item, data: { chainId, dao }, clear, }: InboxItemRendererProps) => { @@ -18,42 +21,36 @@ export const JoinedDaoRenderer = ({ const [loadingFollowing, setLoadingFollowing] = useState(false) + const timestamp = item.timestamp && new Date(item.timestamp) + return ( -
-

{t('info.addedToDaoFollowPrompt')}

- -
- - - +
+
+ + +

+ {t('info.addedToDaoFollowPrompt', { + context: timestamp ? 'withTimestamp' : 'withoutTimestamp', + timestamp: timestamp ? formatLongDateTime(timestamp) : undefined, + })} +

+ +
) } diff --git a/packages/stateful/components/inbox/renderers/Proposal.tsx b/packages/stateful/components/inbox/renderers/Proposal.tsx index 345c187fa..8891918fa 100644 --- a/packages/stateful/components/inbox/renderers/Proposal.tsx +++ b/packages/stateful/components/inbox/renderers/Proposal.tsx @@ -1,12 +1,6 @@ -import { Done } from '@mui/icons-material' import { useTranslation } from 'react-i18next' -import { - ChainProvider, - IconButton, - Tooltip, - useDaoNavHelpers, -} from '@dao-dao/stateless' +import { ChainProvider, useDaoNavHelpers } from '@dao-dao/stateless' import { InboxItemRendererProps, InboxItemType, @@ -20,7 +14,6 @@ import { LinkWrapper } from '../../LinkWrapper' export const ProposalRenderer = ({ item, data: { chainId, dao, proposalId, proposalTitle }, - clear, }: InboxItemRendererProps) => { const { t } = useTranslation() const { getDaoProposalPath } = useDaoNavHelpers() @@ -40,59 +33,45 @@ export const ProposalRenderer = ({ return ( -
- - {/* Desktop */} -
-
- - -

- {proposalId + ': ' + proposalTitle} -

-
- - {timestamp && ( -

- {status && `${status} @ `} - {formatLongDateTime(timestamp)} -

- )} -
- - {/* Mobile */} -
+ + {/* Desktop */} +
+

{proposalId + ': ' + proposalTitle}

- - {timestamp && ( -

- {status && `${status} @ `} - {formatDateTimeTz(timestamp)} -

- )}
- - -
- -
-
-
+ {timestamp && ( +

+ {status && `${status} @ `} + {formatLongDateTime(timestamp)} +

+ )} +
+ + {/* Mobile */} +
+ + +

+ {proposalId + ': ' + proposalTitle} +

+ + {timestamp && ( +

+ {status && `${status} @ `} + {formatDateTimeTz(timestamp)} +

+ )} +
+
) }