From 374447ccc734651184dac53a16aab41fc93db75a Mon Sep 17 00:00:00 2001 From: Jamie Curnow Date: Mon, 16 Jan 2023 15:50:40 +1000 Subject: [PATCH] Locales cleanup --- frontend/src/api/npm/createCertificate.ts | 16 ++ frontend/src/api/npm/getCertificate.ts | 13 + frontend/src/api/npm/index.ts | 3 + frontend/src/api/npm/setCertificate.ts | 17 ++ frontend/src/hooks/index.ts | 1 + frontend/src/hooks/useCertificate.ts | 56 +++++ frontend/src/locale/src/de.json | 8 +- frontend/src/locale/src/en.json | 8 +- frontend/src/locale/src/fa.json | 8 +- frontend/src/modals/AccessListCreateModal.tsx | 4 +- .../CertificateAuthorityCreateModal.tsx | 4 +- .../modals/CertificateAuthorityEditModal.tsx | 4 +- .../src/modals/CertificateCreateModal.tsx | 111 +-------- frontend/src/modals/CertificateEditModal.tsx | 4 +- .../src/modals/DNSProviderCreateModal.tsx | 4 +- .../modals/DNSProviderEditModal.tsx.disabled | 229 ------------------ frontend/src/modals/HostCreateModal.tsx | 4 +- frontend/src/modals/UpstreamCreateModal.tsx | 4 +- frontend/src/modals/UpstreamEditModal.tsx | 4 +- frontend/src/pages/AccessLists/Table.tsx | 2 +- .../pages/CertificateAuthorities/Table.tsx | 2 +- frontend/src/pages/Certificates/Table.tsx | 2 +- frontend/src/pages/DNSProviders/Table.tsx | 2 +- .../NginxTemplates/NginxTemplatesTable.tsx | 2 +- frontend/src/pages/Settings/SettingsTable.tsx | 2 +- frontend/src/pages/Upstreams/Table.tsx | 2 +- 26 files changed, 142 insertions(+), 374 deletions(-) create mode 100644 frontend/src/api/npm/createCertificate.ts create mode 100644 frontend/src/api/npm/getCertificate.ts create mode 100644 frontend/src/api/npm/setCertificate.ts create mode 100644 frontend/src/hooks/useCertificate.ts delete mode 100644 frontend/src/modals/DNSProviderEditModal.tsx.disabled diff --git a/frontend/src/api/npm/createCertificate.ts b/frontend/src/api/npm/createCertificate.ts new file mode 100644 index 00000000..5f662a63 --- /dev/null +++ b/frontend/src/api/npm/createCertificate.ts @@ -0,0 +1,16 @@ +import * as api from "./base"; +import { Certificate } from "./models"; + +export async function createCertificate( + data: Certificate, + abortController?: AbortController, +): Promise { + const { result } = await api.post( + { + url: "/certificates", + data, + }, + abortController, + ); + return result; +} diff --git a/frontend/src/api/npm/getCertificate.ts b/frontend/src/api/npm/getCertificate.ts new file mode 100644 index 00000000..32cc84d9 --- /dev/null +++ b/frontend/src/api/npm/getCertificate.ts @@ -0,0 +1,13 @@ +import * as api from "./base"; +import { Certificate } from "./models"; + +export async function getCertificate( + id: number, + params = {}, +): Promise { + const { result } = await api.get({ + url: `/certificates/${id}`, + params, + }); + return result; +} diff --git a/frontend/src/api/npm/index.ts b/frontend/src/api/npm/index.ts index 8c72bf00..cd8d970b 100644 --- a/frontend/src/api/npm/index.ts +++ b/frontend/src/api/npm/index.ts @@ -1,7 +1,9 @@ +export * from "./createCertificate"; export * from "./createCertificateAuthority"; export * from "./createDNSProvider"; export * from "./createUser"; export * from "./getAccessLists"; +export * from "./getCertificate"; export * from "./getCertificateAuthorities"; export * from "./getCertificateAuthority"; export * from "./getCertificates"; @@ -22,6 +24,7 @@ export * from "./models"; export * from "./refreshToken"; export * from "./responseTypes"; export * from "./setAuth"; +export * from "./setCertificate"; export * from "./setCertificateAuthority"; export * from "./setDNSProvider"; export * from "./setUser"; diff --git a/frontend/src/api/npm/setCertificate.ts b/frontend/src/api/npm/setCertificate.ts new file mode 100644 index 00000000..b5bb998c --- /dev/null +++ b/frontend/src/api/npm/setCertificate.ts @@ -0,0 +1,17 @@ +import * as api from "./base"; +import { Certificate } from "./models"; + +export async function setCertificate( + id: number, + data: any, +): Promise { + if (data.id) { + delete data.id; + } + + const { result } = await api.put({ + url: `/certificates/${id}`, + data, + }); + return result; +} diff --git a/frontend/src/hooks/index.ts b/frontend/src/hooks/index.ts index 35331a0d..ca1d1842 100644 --- a/frontend/src/hooks/index.ts +++ b/frontend/src/hooks/index.ts @@ -1,4 +1,5 @@ export * from "./useAccessLists"; +export * from "./useCertificate"; export * from "./useCertificateAuthorities"; export * from "./useCertificateAuthority"; export * from "./useCertificates"; diff --git a/frontend/src/hooks/useCertificate.ts b/frontend/src/hooks/useCertificate.ts new file mode 100644 index 00000000..31dbeadf --- /dev/null +++ b/frontend/src/hooks/useCertificate.ts @@ -0,0 +1,56 @@ +import { + createCertificate, + getCertificate, + setCertificate, + Certificate, +} from "api/npm"; +import { useMutation, useQuery, useQueryClient } from "react-query"; + +const fetchCertificate = (id: any) => { + return getCertificate(id); +}; + +const useCertificate = (id: number, options = {}) => { + return useQuery( + ["certificate", id], + () => fetchCertificate(id), + { + staleTime: 60 * 1000, // 1 minute + ...options, + }, + ); +}; + +const useSetCertificate = () => { + const queryClient = useQueryClient(); + return useMutation( + (values: Certificate) => { + return values.id + ? setCertificate(values.id, values) + : createCertificate(values); + }, + { + onMutate: (values) => { + const previousObject = queryClient.getQueryData([ + "certificate", + values.id, + ]); + + queryClient.setQueryData(["certificate", values.id], (old: any) => ({ + ...old, + ...values, + })); + + return () => + queryClient.setQueryData(["certificate", values.id], previousObject); + }, + onError: (error, values, rollback: any) => rollback(), + onSuccess: async ({ id }: Certificate) => { + queryClient.invalidateQueries(["certificate", id]); + queryClient.invalidateQueries("certificate"); + }, + }, + ); +}; + +export { useCertificate, useSetCertificate }; diff --git a/frontend/src/locale/src/de.json b/frontend/src/locale/src/de.json index fa56e497..319d4fcf 100644 --- a/frontend/src/locale/src/de.json +++ b/frontend/src/locale/src/de.json @@ -56,9 +56,6 @@ "certificate-authority.max-domains": { "defaultMessage": "Maximale Domains pro Zertifikat" }, - "certificate-authority.name": { - "defaultMessage": "Name" - }, "certificate.create": { "defaultMessage": "Zertifikat erstellen" }, @@ -86,9 +83,6 @@ "column.max-domains": { "defaultMessage": "Domänen pro Zertifikat" }, - "column.name": { - "defaultMessage": "Name" - }, "column.servers": { "defaultMessage": "Servers" }, @@ -140,7 +134,7 @@ "dns-provider.create": { "defaultMessage": "Erstellen Sie einen DNS-Anbieter" }, - "dns-provider.name": { + "name": { "defaultMessage": "Name" }, "dns-providers.title": { diff --git a/frontend/src/locale/src/en.json b/frontend/src/locale/src/en.json index c539c5e2..0a8cac72 100644 --- a/frontend/src/locale/src/en.json +++ b/frontend/src/locale/src/en.json @@ -332,9 +332,6 @@ "certificate-authority.max-domains": { "defaultMessage": "Maximum Domains per Certificate" }, - "certificate-authority.name": { - "defaultMessage": "Name" - }, "certificate.create": { "defaultMessage": "Create Certificate" }, @@ -362,9 +359,6 @@ "column.max-domains": { "defaultMessage": "Domains per Cert" }, - "column.name": { - "defaultMessage": "Name" - }, "column.servers": { "defaultMessage": "Servers" }, @@ -416,7 +410,7 @@ "dns-provider.create": { "defaultMessage": "Create DNS Provider" }, - "dns-provider.name": { + "name": { "defaultMessage": "Name" }, "dns-providers.title": { diff --git a/frontend/src/locale/src/fa.json b/frontend/src/locale/src/fa.json index 92d45efd..4b3d7e80 100644 --- a/frontend/src/locale/src/fa.json +++ b/frontend/src/locale/src/fa.json @@ -56,9 +56,6 @@ "certificate-authority.max-domains": { "defaultMessage": "حداکثر دامنه در هر گواهی" }, - "certificate-authority.name": { - "defaultMessage": "نام" - }, "certificate.create": { "defaultMessage": "ایجاد گواهی" }, @@ -86,9 +83,6 @@ "column.max-domains": { "defaultMessage": "دامنه در هر گواهی" }, - "column.name": { - "defaultMessage": "نام" - }, "column.servers": { "defaultMessage": "Servers" }, @@ -140,7 +134,7 @@ "dns-provider.create": { "defaultMessage": "ارائه دهنده DNS ایجاد کنید" }, - "dns-provider.name": { + "name": { "defaultMessage": "نام" }, "dns-providers.title": { diff --git a/frontend/src/modals/AccessListCreateModal.tsx b/frontend/src/modals/AccessListCreateModal.tsx index e0604e10..1b17e3a2 100644 --- a/frontend/src/modals/AccessListCreateModal.tsx +++ b/frontend/src/modals/AccessListCreateModal.tsx @@ -97,14 +97,14 @@ function AccessListCreateModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} {form.errors.name} diff --git a/frontend/src/modals/CertificateAuthorityCreateModal.tsx b/frontend/src/modals/CertificateAuthorityCreateModal.tsx index c5a592f5..fd3368c6 100644 --- a/frontend/src/modals/CertificateAuthorityCreateModal.tsx +++ b/frontend/src/modals/CertificateAuthorityCreateModal.tsx @@ -96,14 +96,14 @@ function CertificateAuthorityCreateModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} {form.errors.name} diff --git a/frontend/src/modals/CertificateAuthorityEditModal.tsx b/frontend/src/modals/CertificateAuthorityEditModal.tsx index e2ec9419..3a7c9a57 100644 --- a/frontend/src/modals/CertificateAuthorityEditModal.tsx +++ b/frontend/src/modals/CertificateAuthorityEditModal.tsx @@ -109,14 +109,14 @@ function CertificateAuthorityEditModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} diff --git a/frontend/src/modals/CertificateCreateModal.tsx b/frontend/src/modals/CertificateCreateModal.tsx index 51f68078..07a4f45f 100644 --- a/frontend/src/modals/CertificateCreateModal.tsx +++ b/frontend/src/modals/CertificateCreateModal.tsx @@ -1,6 +1,5 @@ import { Button, - Checkbox, FormControl, FormErrorMessage, FormLabel, @@ -15,12 +14,12 @@ import { Stack, useToast, } from "@chakra-ui/react"; -import { CertificateAuthority } from "api/npm"; +import { Certificate } from "api/npm"; import { PrettyButton } from "components"; import { Formik, Form, Field } from "formik"; -import { useSetCertificateAuthority } from "hooks"; +import { useSetCertificate } from "hooks"; import { intl } from "locale"; -import { validateNumber, validateString } from "modules/Validations"; +import { validateString } from "modules/Validations"; interface CertificateCreateModalProps { isOpen: boolean; @@ -31,10 +30,10 @@ function CertificateCreateModal({ onClose, }: CertificateCreateModalProps) { const toast = useToast(); - const { mutate: setCertificateAuthority } = useSetCertificateAuthority(); + const { mutate: setCertificate } = useSetCertificate(); const onSubmit = async ( - payload: CertificateAuthority, + payload: Certificate, { setErrors, setSubmitting }: any, ) => { const showErr = (msg: string) => { @@ -49,7 +48,7 @@ function CertificateCreateModal({ }); }; - setCertificateAuthority(payload, { + setCertificate(payload, { onError: (err: any) => { if (err.message === "ca-bundle-does-not-exist") { setErrors({ @@ -78,13 +77,13 @@ function CertificateCreateModal({ caBundle: "", maxDomains: 5, isWildcardSupported: false, - } as CertificateAuthority + } as Certificate } onSubmit={onSubmit}> {({ isSubmitting }) => (
- {intl.formatMessage({ id: "certificate-authority.create" })} + {intl.formatMessage({ id: "certificate.create" })} @@ -96,110 +95,20 @@ function CertificateCreateModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} {form.errors.name} )} - - {({ field, form }: any) => ( - - - {intl.formatMessage({ - id: "certificate-authority.acmesh-server", - })} - - - - {form.errors.acmeshServer} - - - )} - - - {({ field, form }: any) => ( - - - {intl.formatMessage({ - id: "certificate-authority.ca-bundle", - })} - - - - {form.errors.caBundle} - - - )} - - - {({ field, form }: any) => ( - - - {intl.formatMessage({ - id: "certificate-authority.max-domains", - })} - - - - {form.errors.maxDomains} - - - )} - - - {({ field, form }: any) => ( - - - {intl.formatMessage({ - id: "certificate-authority.has-wildcard-support", - })} - - - {form.errors.isWildcardSupported} - - - )} - diff --git a/frontend/src/modals/CertificateEditModal.tsx b/frontend/src/modals/CertificateEditModal.tsx index 93447a9b..302575e7 100644 --- a/frontend/src/modals/CertificateEditModal.tsx +++ b/frontend/src/modals/CertificateEditModal.tsx @@ -109,14 +109,14 @@ function CertificateEditModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} diff --git a/frontend/src/modals/DNSProviderCreateModal.tsx b/frontend/src/modals/DNSProviderCreateModal.tsx index 6963f94b..22d64370 100644 --- a/frontend/src/modals/DNSProviderCreateModal.tsx +++ b/frontend/src/modals/DNSProviderCreateModal.tsx @@ -227,14 +227,14 @@ function DNSProviderCreateModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "dns-provider.name", + id: "name", })} diff --git a/frontend/src/modals/DNSProviderEditModal.tsx.disabled b/frontend/src/modals/DNSProviderEditModal.tsx.disabled deleted file mode 100644 index 2b61c119..00000000 --- a/frontend/src/modals/DNSProviderEditModal.tsx.disabled +++ /dev/null @@ -1,229 +0,0 @@ -import { useEffect, useState } from "react"; - -import { - Button, - Checkbox, - FormControl, - FormErrorMessage, - FormLabel, - Input, - Modal, - ModalOverlay, - ModalContent, - ModalHeader, - ModalCloseButton, - ModalBody, - ModalFooter, - Select, - Stack, - useToast, -} from "@chakra-ui/react"; -import { - DNSProvider, - DNSProvidersAcmesh, - DNSProvidersAcmeshField, -} from "api/npm"; -import { PrettyButton } from "components"; -import { Formik, Form, Field } from "formik"; -import { - useDNSProvider, - useSetDNSProvider, - useDNSProvidersAcmesh, -} from "hooks"; -import { intl } from "locale"; -import { validateString } from "modules/Validations"; - -interface DNSProviderEditModalProps { - editId: number; - isOpen: boolean; - onClose: () => void; -} -function DNSProviderEditModal({ - editId, - isOpen, - onClose, -}: DNSProviderEditModalProps) { - const toast = useToast(); - const { status, data } = useDNSProvider(editId); - const { mutate: setDNSProvider } = useSetDNSProvider(); - - const onSubmit = async ( - payload: DNSProvider, - { setErrors, setSubmitting }: any, - ) => { - // TODO: filter out the meta object and only include items that apply to the acmesh provider selected - - const showErr = (msg: string) => { - toast({ - description: intl.formatMessage({ - id: `error.${msg}`, - }), - status: "error", - position: "top", - duration: 3000, - isClosable: true, - }); - }; - - setDNSProvider(payload, { - onError: (err: any) => { - showErr(err.message); - }, - onSuccess: () => onClose(), - onSettled: () => setSubmitting(false), - }); - }; - - const renderInputType = ( - field: any, - f: DNSProvidersAcmeshField, - value: any, - ) => { - if (f.type === "bool") { - return ( - - {f.name} - - ); - } - - return ( - - ); - }; - - return ( - - - - {acmeshIsLoading ? ( - "loading" - ) : ( - - {({ isSubmitting, handleChange, values, setValues }) => ( - - - {intl.formatMessage({ id: "dns-provider.create" })} - - - - - - {({ field, form }: any) => ( - - - {intl.formatMessage({ - id: "dns-provider.name", - })} - - - - {form.errors.name} - - - )} - - - {({ field, form }: any) => ( - - - {intl.formatMessage({ - id: "dns-provider.acmesh-name", - })} - - - - {form.errors.acmeshName} - - - )} - - {acmeshItem !== "" ?
: null} - {getAcmeshItem(acmeshItem)?.fields.map((f: any) => { - const name = `meta[${f.metaKey}]`; - return ( - - {({ field, form }: any) => ( - - {f.type !== "bool" ? ( - {f.name} - ) : null} - {renderInputType( - field, - f, - values.meta[f.metaKey], - )} - - {form.errors[name]} - - - )} - - ); - })} - - - - - {intl.formatMessage({ id: "form.save" })} - - - - - )} - - )} - - - ); -} - -export { DNSProviderEditModal }; diff --git a/frontend/src/modals/HostCreateModal.tsx b/frontend/src/modals/HostCreateModal.tsx index dad69c54..b9b4aea7 100644 --- a/frontend/src/modals/HostCreateModal.tsx +++ b/frontend/src/modals/HostCreateModal.tsx @@ -93,14 +93,14 @@ function HostCreateModal({ isOpen, onClose }: HostCreateModalProps) { isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} {form.errors.name} diff --git a/frontend/src/modals/UpstreamCreateModal.tsx b/frontend/src/modals/UpstreamCreateModal.tsx index 0aeb7561..98c008d2 100644 --- a/frontend/src/modals/UpstreamCreateModal.tsx +++ b/frontend/src/modals/UpstreamCreateModal.tsx @@ -94,14 +94,14 @@ function UpstreamCreateModal({ isOpen, onClose }: UpstreamCreateModalProps) { isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} {form.errors.name} diff --git a/frontend/src/modals/UpstreamEditModal.tsx b/frontend/src/modals/UpstreamEditModal.tsx index 0ca9daf4..52136692 100644 --- a/frontend/src/modals/UpstreamEditModal.tsx +++ b/frontend/src/modals/UpstreamEditModal.tsx @@ -110,14 +110,14 @@ function UpstreamEditModal({ isInvalid={form.errors.name && form.touched.name}> {intl.formatMessage({ - id: "certificate-authority.name", + id: "name", })} diff --git a/frontend/src/pages/AccessLists/Table.tsx b/frontend/src/pages/AccessLists/Table.tsx index e8694a90..b318add4 100644 --- a/frontend/src/pages/AccessLists/Table.tsx +++ b/frontend/src/pages/AccessLists/Table.tsx @@ -37,7 +37,7 @@ function Table({ sortable: true, }, { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter, diff --git a/frontend/src/pages/CertificateAuthorities/Table.tsx b/frontend/src/pages/CertificateAuthorities/Table.tsx index eebb819c..6a4fae8f 100644 --- a/frontend/src/pages/CertificateAuthorities/Table.tsx +++ b/frontend/src/pages/CertificateAuthorities/Table.tsx @@ -33,7 +33,7 @@ function Table({ const [columns, tableData] = useMemo(() => { const columns = [ { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter, diff --git a/frontend/src/pages/Certificates/Table.tsx b/frontend/src/pages/Certificates/Table.tsx index 966654e2..3d815849 100644 --- a/frontend/src/pages/Certificates/Table.tsx +++ b/frontend/src/pages/Certificates/Table.tsx @@ -49,7 +49,7 @@ function Table({ sortable: true, }, { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter, diff --git a/frontend/src/pages/DNSProviders/Table.tsx b/frontend/src/pages/DNSProviders/Table.tsx index dec32899..e388f03d 100644 --- a/frontend/src/pages/DNSProviders/Table.tsx +++ b/frontend/src/pages/DNSProviders/Table.tsx @@ -39,7 +39,7 @@ function Table({ sortable: true, }, { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter, diff --git a/frontend/src/pages/NginxTemplates/NginxTemplatesTable.tsx b/frontend/src/pages/NginxTemplates/NginxTemplatesTable.tsx index c9c61f21..6078d98c 100644 --- a/frontend/src/pages/NginxTemplates/NginxTemplatesTable.tsx +++ b/frontend/src/pages/NginxTemplates/NginxTemplatesTable.tsx @@ -50,7 +50,7 @@ function NginxTemplatesTable({ sortable: true, }, { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter, diff --git a/frontend/src/pages/Settings/SettingsTable.tsx b/frontend/src/pages/Settings/SettingsTable.tsx index 52ba237d..43fdd896 100644 --- a/frontend/src/pages/Settings/SettingsTable.tsx +++ b/frontend/src/pages/Settings/SettingsTable.tsx @@ -41,7 +41,7 @@ function SettingsTable({ const [columns, tableData] = useMemo(() => { const columns = [ { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter, diff --git a/frontend/src/pages/Upstreams/Table.tsx b/frontend/src/pages/Upstreams/Table.tsx index 7c130687..232887be 100644 --- a/frontend/src/pages/Upstreams/Table.tsx +++ b/frontend/src/pages/Upstreams/Table.tsx @@ -47,7 +47,7 @@ function Table({ className: "w-80", }, { - Header: intl.formatMessage({ id: "column.name" }), + Header: intl.formatMessage({ id: "name" }), accessor: "name", sortable: true, Filter: TextFilter,