BOHEUS
ff001d9def
As per title, add ~200 missing translations in different places of app. Most places are now available for translation with AI but still some aren't available - some enums (like in MenuItemSelectColor.tsx) or values in complex types (like in SettingsNonCompositeFieldTypeConfigs.ts) or values where are injected some variables (like in SettingsDataModelFieldNumberForm.tsx) --------- Co-authored-by: Félix Malfait <felix@twenty.com>
64 lines
2.2 KiB
TypeScript
64 lines
2.2 KiB
TypeScript
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
|
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
|
import { SettingsApiKeysFieldItemTableRow } from '@/settings/developers/components/SettingsApiKeysFieldItemTableRow';
|
|
import { ApiFieldItem } from '@/settings/developers/types/api-key/ApiFieldItem';
|
|
import { ApiKey } from '@/settings/developers/types/api-key/ApiKey';
|
|
import { formatExpirations } from '@/settings/developers/utils/formatExpiration';
|
|
import { Table } from '@/ui/layout/table/components/Table';
|
|
import { TableBody } from '@/ui/layout/table/components/TableBody';
|
|
import { TableHeader } from '@/ui/layout/table/components/TableHeader';
|
|
import { TableRow } from '@/ui/layout/table/components/TableRow';
|
|
import styled from '@emotion/styled';
|
|
import { MOBILE_VIEWPORT } from 'twenty-ui';
|
|
import { Trans } from '@lingui/react/macro';
|
|
|
|
const StyledTableBody = styled(TableBody)`
|
|
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
|
|
@media (max-width: ${MOBILE_VIEWPORT}px) {
|
|
padding-top: ${({ theme }) => theme.spacing(3)};
|
|
display: flex;
|
|
justify-content: space-between;
|
|
scroll-behavior: smooth;
|
|
}
|
|
`;
|
|
|
|
const StyledTableRow = styled(TableRow)`
|
|
grid-template-columns: 312px auto 28px;
|
|
@media (max-width: ${MOBILE_VIEWPORT}px) {
|
|
width: 95%;
|
|
grid-template-columns: 20fr 2fr;
|
|
}
|
|
`;
|
|
|
|
export const SettingsApiKeysTable = () => {
|
|
const { records: apiKeys } = useFindManyRecords<ApiKey>({
|
|
objectNameSingular: CoreObjectNameSingular.ApiKey,
|
|
filter: { revokedAt: { is: 'NULL' } },
|
|
});
|
|
|
|
return (
|
|
<Table>
|
|
<StyledTableRow>
|
|
<TableHeader>
|
|
<Trans>Name</Trans>
|
|
</TableHeader>
|
|
<TableHeader>
|
|
<Trans>Expiration</Trans>
|
|
</TableHeader>
|
|
<TableHeader></TableHeader>
|
|
</StyledTableRow>
|
|
{!!apiKeys.length && (
|
|
<StyledTableBody>
|
|
{formatExpirations(apiKeys).map((fieldItem) => (
|
|
<SettingsApiKeysFieldItemTableRow
|
|
key={fieldItem.id}
|
|
fieldItem={fieldItem as ApiFieldItem}
|
|
to={`/settings/developers/api-keys/${fieldItem.id}`}
|
|
/>
|
|
))}
|
|
</StyledTableBody>
|
|
)}
|
|
</Table>
|
|
);
|
|
};
|