feat(approval-domain): add UI for approval domains (#10480)

This commit is contained in:
Antoine Moreaux
2025-02-25 16:44:07 +01:00
committed by GitHub
parent 9997cf5a4e
commit 7c9b902cfe
8 changed files with 110 additions and 18 deletions

View File

@ -15,6 +15,7 @@ import { approvedAccessDomainsState } from '@/settings/security/states/ApprovedA
import { SettingsSecurityApprovedAccessDomainRowDropdownMenu } from '@/settings/security/components/approvedAccessDomains/SettingsSecurityApprovedAccessDomainRowDropdownMenu';
import { SettingsSecurityApprovedAccessDomainValidationEffect } from '@/settings/security/components/approvedAccessDomains/SettingsSecurityApprovedAccessDomainValidationEffect';
import { useGetApprovedAccessDomainsQuery } from '~/generated/graphql';
import { beautifyPastDateRelativeToNow } from '~/utils/date-utils';
const StyledLink = styled(Link)`
text-decoration: none;
@ -41,6 +42,11 @@ export const SettingsApprovedAccessDomainsListCard = () => {
},
});
const getItemDescription = (createdAt: string) => {
const beautifyPastDateRelative = beautifyPastDateRelativeToNow(createdAt);
return t`Added ${beautifyPastDateRelative}`;
};
return loading || !approvedAccessDomains.length ? (
<StyledLink to={getSettingsPath(SettingsPath.NewApprovedAccessDomain)}>
<SettingsCard
@ -53,9 +59,8 @@ export const SettingsApprovedAccessDomainsListCard = () => {
<SettingsSecurityApprovedAccessDomainValidationEffect />
<SettingsListCard
items={approvedAccessDomains}
getItemLabel={(approvedAccessDomain) =>
`${approvedAccessDomain.domain} - ${approvedAccessDomain.createdAt}`
}
getItemLabel={({ domain }) => domain}
getItemDescription={({ createdAt }) => getItemDescription(createdAt)}
RowIcon={IconAt}
RowRightComponent={({ item: approvedAccessDomain }) => (
<SettingsSecurityApprovedAccessDomainRowDropdownMenu