update

src/App.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { hot } from 'react-hot-loader/root';
-import { Layout } from 'antd';
+import { Layout, Menu } from 'antd';
 import { GithubProvider } from './contexts/Github';
 import { EncryptionProvider } from './contexts/Encryption';
 import { DecryptionProvider } from './contexts/Decryption';
@@ -11,6 +11,8 @@ const App: React.FC = () => (
     <EncryptionProvider>
       <DecryptionProvider>
         <Layout style={{minHeight:"100vh"}}>
+          <Layout.Header>
+          </Layout.Header>
           <Layout.Content style={{ padding: '25px', maxWidth: '800px', width: '100%', margin: 'auto' }}>
             <AppRouter/>
           </Layout.Content>

src/contexts/Decryption.tsx

@@ -8,6 +8,7 @@ interface DecryptionContextType {
   publicKey: string | undefined;
   privateKey: string | undefined;
   createKey: (name: string, email: string) => void;
+  deleteKey: () => void;
   files: {[id: string]: FileType};
   addFile: (file: File) => Promise<void>;
   deleteFile: (id: string) => void;
@@ -24,6 +25,7 @@ const DecryptionContext = createContext<DecryptionContextType>({
   privateKey: undefined,
   files: {},
   createKey: async () => { throw new Error('Not using provider'); },
+  deleteKey: async () => { throw new Error('Not using provider'); },
   addFile: async () => { throw new Error('Not using provider'); },
   deleteFile: async () => { throw new Error('Not using provider'); },
 });
@@ -71,6 +73,12 @@ const DecryptionProvider: React.FC = ({
     run();
   }, []);
 
+  const deleteKey = () => {
+    setPublicKey(undefined);
+    setPrivateKey(undefined);
+    localStorage.removeItem('key');
+  };
+
   const createKey = async () => {
     const key = await openpgp.generateKey({
       userIds: [{ name: 'unknown unknown', email: 'unknown@unknown.foo'}],
@@ -103,6 +111,7 @@ const DecryptionProvider: React.FC = ({
         publicKey,
         privateKey,
         createKey,
+        deleteKey,
         files,
         addFile,
         deleteFile,

src/screens/SetupKey.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useState, useCallback } from 'react';
-import { Space, Typography, Input, Button, Form } from 'antd';
+import { Popconfirm, Space, Typography, Input, Button, Form } from 'antd';
 import DecryptionContext from '../contexts/Decryption';
 import { downloadLink } from '../helpers/files';
 import {
@@ -12,6 +12,7 @@ import {
 const SetupKey: React.FC = () => {
   const {
     createKey,
+    deleteKey,
     publicKey,
   } = useContext(DecryptionContext);
 
@@ -86,15 +87,28 @@ const SetupKey: React.FC = () => {
         <p>
           Remember that you need to go to this website on this device to decrypt the files after receiving them
         </p>
-        
-        <Button
-          onClick={downloadPublicKey}
-          type="primary"
-          size="large"
-          shape="round"
-        >
-          Download sharing key
-        </Button>
+        <Space direction="vertical" size="large"> 
+          <Button
+            onClick={downloadPublicKey}
+            type="primary"
+            size="large"
+            shape="round"
+          >
+            Download sharing key
+          </Button>
+          <Popconfirm
+          title="Are you sure?"
+            onConfirm={deleteKey}
+          >
+            <Button
+              danger
+              size="small"
+              type="link"
+            >
+              Delete sharing key
+            </Button>
+          </Popconfirm>
+        </Space>
       </div>
     );
   }