update

src/App.tsx

@@ -6,7 +6,7 @@ import { EncryptionProvider } from './contexts/Encryption';
 import AppRouter from './Router';
 
 const App: React.FC = () => (
-  <GithubProvider username="morten-olsen">
+  <GithubProvider>
     <EncryptionProvider>
       <Layout style={{minHeight:"100vh"}}>
         <Layout.Content style={{ padding: '25px', maxWidth: '800px', width: '100%', margin: 'auto' }}>

src/components/Profile.tsx

@@ -1,71 +0,0 @@
-import React, { useContext, useState } from 'react';
-import {
-  Card,
-  Avatar,
-  Button,
-  Modal,
-} from 'antd';
-import { KeyOutlined, GithubOutlined } from '@ant-design/icons'
-import GithubContext from '../contexts/Github';
-
-const IconText = ({ icon, text, ...props }) => (
-  <Button
-    {...props}
-    icon={React.createElement(icon)}
-  >
-    {text}
-  </Button>
-);
-
-const Profile: React.FC = () => {
-  const { user, keys } = useContext(GithubContext);
-  const [showKeys, setShowKeys] = useState(false);
-  if (!user) {
-    return null;
-  }
-  
-  return (
-    <>
-      <Modal
-        visible={showKeys}
-        onOk={() => setShowKeys(false)}
-        onCancel={() => setShowKeys(false)}
-        title="Keys"
-      >
-        <pre>
-          {keys!.join('\n\n')}
-        </pre>
-      </Modal>
-      <Card
-        style={{ width: 300, marginTop: 16, alignSelf: 'center' }}
-        actions={[(
-          <IconText
-            key="showkeys"
-            text="Show keys"
-            icon={KeyOutlined}
-            onClick={() => setShowKeys(true)}
-          />
-        ), (
-          <a target="_blank" href={`https://github.com/${user.login}`}>
-            <IconText
-              key="gotogithub"
-              text="Go to Github"
-              icon={GithubOutlined}
-            />
-          </a>
-        )]}
-      >
-        <Card.Meta
-          title={user.name}
-          avatar={(
-            <Avatar src={user.avatar_url} size={80} />
-          )}
-          description={user.location}
-        />
-          
-      </Card>
-    </>
-  );
-};
-
-export default Profile;

src/contexts/Github.tsx

@@ -1,87 +1,14 @@
-import React, { useState, useEffect, createContext } from 'react';
-import { Layout, Spin } from 'antd';
+import React, { createContext } from 'react';
+
+const data = require('../../data.json');
 
 interface GithubContextType {
   username: string;
-  user?: any;
   keys?: string[];
-  error?: any;
-  state: 'loading' | 'ready' | 'failed'
 }
 
-interface Props {
-  username: string;
-  children: React.ReactNode;
-}
-
-const Loader = () => (
-  <Layout
-    style={{
-      position: 'fixed',
-      alignItems: 'center',
-      justifyContent: 'center',
-      height: '100%',
-      width: '100%',
-    }}
-  >
-    <Spin size="large" />
-  </Layout>
-);
-
-const GithubContext = createContext<GithubContextType>({
-  username: 'unknown',
-  state: 'failed',
-});
-
-const headers = {
-};
-
-const GithubProvider: React.FC<Props> = ({
-  username,
-  children,
-}) => {
-  const [keys, setKeys] = useState<GithubContextType['keys'] | undefined>();
-  const [state, setState] = useState<GithubContextType['state']>('loading');
-  const [error, setError] = useState<GithubContextType['state'] | undefined>();
-  const [user, setUser] = useState<GithubContextType['user'] | undefined>();
-
-  useEffect(() => {
-    const run = async () => {
-      try {
-        const keysRes = await fetch(`https://api.github.com/users/${username}/gpg_keys`, { headers });
-        const userRes = await fetch(`https://api.github.com/users/${username}`, { headers });
-        const keys = await keysRes.json();
-        const user = await userRes.json();
-        setState('ready');
-        setKeys(keys.map((key: any) => key.raw_key));
-        setUser(user);
-      } catch (err) {
-        setState('failed');
-        setError(err);
-      }
-    };
-
-    run();
-  }, [username]);
-
-  if (state === 'loading') {
-    return <Loader />;
-  }
-
-  return (
-    <GithubContext.Provider
-      value={{
-        username,
-        user,
-        keys,
-        state,
-        error,
-      }}
-    >
-      {children}
-    </GithubContext.Provider>
-  );
-};
+const GithubContext = createContext<GithubContextType>(data);
+const GithubProvider = GithubContext.Provider;
 
 export {
   GithubProvider,

src/index.html

@@ -1,12 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Document</title>
-</head>
-<body>
-  <div id="root"></div>
-  <script src="index.tsx"></script>
-</body>
-</html>

src/index.tsx

@@ -1,8 +1,31 @@
+import OfflinePluginRuntime from 'offline-plugin/runtime';
+import { notification } from 'antd';
 import React from 'react';
 import 'antd/dist/antd.css';
 import { render }  from 'react-dom';
 import App from './App';
 
+OfflinePluginRuntime.install({
+  onUpdating: () => {
+    console.log('SW Event:', 'onUpdating');
+  },
+  onUpdateReady: () => {
+    console.log('SW Event:', 'onUpdateReady');
+    OfflinePluginRuntime.applyUpdate();
+  },
+  onUpdated: () => {
+    notification.success({
+      message: 'Your app has been updated',
+    });
+  },
+  onUpdateFailed: () => {
+    notification.warn({
+      message: 'Could not update to the latest version',
+    });
+    console.log('SW Event:', 'onUpdateFailed');
+  }
+});
+
 const root = document.createElement('div');
 root.style.height = '100%';
 document.body.appendChild(root);

src/screens/Welcome.tsx

@@ -22,10 +22,10 @@ const Welcome: React.FC = () => {
         <EyeInvisibleTwoTone style={{ fontSize: 200 }} />
         <Typography.Title level={1}>Protect before sending</Typography.Title>
         <p>
-        The internet can seem like a scary place, especially if you want to send sensitiv information across it.
+          The internet can seem like a scary place, especially if you want to send sensitiv information across it.
         </p>
         <p>
-            The truth is that a lot of systems, including e-mails, was not build for the internet that we have today.
+          The truth is that a lot of systems, including e-mails, was not build for the internet that we have today.
         </p>
         <p>
           This is why it is so important to make sure your documents are well protected before sharing.