Add nginx cert config panel

app/components/certificate/certificate-available.tsx

@@ -13,6 +13,7 @@ import Description from './description';
 import GeneralPanel from './panels/general';
 import NodePanel from './panels/node';
 import AwsPanel from './panels/aws';
+import NginxPanel from './panels/nginx';
 
 interface CertificateAvailableProps {
  validFromFormatted: string;
@@ -72,12 +73,15 @@ export default function CertificateAvailable({
  <Tab>General</Tab>
  <Tab>Node.js</Tab>
  <Tab>AWS</Tab>
+ <Tab>NGINX</Tab>
  </TabList>
 
  <TabPanels>
  <GeneralPanel publicKey={publicKey} privateKey={privateKey} />
  <NodePanel publicKey={publicKey} privateKey={privateKey} />
  <AwsPanel publicKey={publicKey} privateKey={privateKey} />
+ {/* TODO: needs to be updated with full chain... */}
+ <NginxPanel fullChain={publicKey} privateKey={privateKey} />
  </TabPanels>
  </Tabs>
  </>

app/components/certificate/panels/nginx.tsx

@@ -0,0 +1,38 @@
+import { Divider, TabPanel, Text, Link } from '@chakra-ui/react';
+import CertificateDisplay from '../certificate-display';
+
+interface NginxPanelProps {
+ fullChain: string;
+ privateKey: string;
+}
+
+export default function NginxPanel({ fullChain, privateKey }: NginxPanelProps) {
+ return (
+ <TabPanel>
+ <Text marginBottom={4}>
+ You can use your certificate with{' '}
+ <Link
+ href="https://www.nginx.com/blog/using-free-ssltls-certificates-from-lets-encrypt-with-nginx/"
+ isExternal
+ >
+ NGINX to create a secure HTTPS server
+ </Link>
+ .
+ </Text>
+
+ <CertificateDisplay
+ title="Full Chain"
+ value={fullChain}
+ description="Your Public Certificate combined with the Let's Encrypt intermediate certificate chain into a single certificate."
+ pathname="cert"
+ />
+ <Divider />
+ <CertificateDisplay
+ title="Private Key"
+ value={privateKey}
+ description="Private certificate key, do not share it."
+ pathname="privkey"
+ />
+ </TabPanel>
+ );
+}