update

2026-02-08 01:36:24 +01:00 · 2020-08-22 11:12:56 +02:00
parent 3f0f791dbe
commit 2824588e4f
11 changed files with 132 additions and 167 deletions
--- a/data.json
+++ b/data.json
--- a/html.html
+++ b/html.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'self' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; connect-src 'self'">
+    <meta charset="UTF-8">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+  </head>
+  <body>
+  </body>
+</html>
--- a/package.json
+++ b/package.json
@@ -20,11 +20,13 @@
    "@types/react-router": "^5.1.8",
    "@types/react-router-dom": "^5.1.5",
    "@types/styled-components": "^5.1.2",
+    "@types/webpack-subresource-integrity": "^1.2.0",
    "antd": "^4.5.4",
    "babel-loader": "^8.1.0",
    "babel-plugin-transform-inline-environment-variables": "^0.4.3",
    "css-loader": "^4.2.1",
    "html-webpack-plugin": "^4.3.0",
+    "offline-plugin": "^5.0.7",
    "parcel-bundler": "^1.12.4",
    "react-hot-loader": "^4.12.21",
    "style-loader": "^1.2.1",
@@ -32,7 +34,8 @@
    "typescript": "^3.9.7",
    "webpack": "^4.44.1",
    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.0"
+    "webpack-dev-server": "^3.11.0",
+    "webpack-subresource-integrity": "^1.4.1"
  },
  "dependencies": {
    "nanoid": "^3.1.12",
--- a/src/App.tsx
+++ b/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' }}>
--- a/src/components/Profile.tsx
+++ b/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;
--- a/src/contexts/Github.tsx
+++ b/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,
--- a/src/index.html
+++ b/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>
--- a/src/index.tsx
+++ b/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);
--- a/src/screens/Welcome.tsx
+++ b/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.
--- a/webpack.config.ts
+++ b/webpack.config.ts
@@ -1,7 +1,10 @@
 import { Configuration } from 'webpack';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
+import SriPlugin from 'webpack-subresource-integrity';
 import path from 'path';

+const OfflinePlugin = require('offline-plugin');
+
 const __DEV__ = process.env.NODE_ENV !== 'production';

 const config: Configuration = {
@@ -14,6 +17,7 @@ const config: Configuration = {
  },
  output: {
    path: path.join(__dirname, 'dist'),
+    crossOriginLoading: 'anonymous',
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.js'],
@@ -21,10 +25,21 @@ const config: Configuration = {
      'react-dom': '@hot-loader/react-dom',
    },
  },
+  optimization: {
+    usedExports: true,
+  },
  plugins: [
+    new SriPlugin({
+      hashFuncNames: ['sha256', 'sha384'],
+      enabled: !__DEV__,
+    }),
    new HtmlWebpackPlugin({
      title: 'Parcel',
      minify: true,
+      template: path.join(__dirname, 'html.html'),
+    }),
+    new OfflinePlugin({
+      events: true,
    }),
  ],
  module: {
--- a/yarn.lock
+++ b/yarn.lock
@@ -1262,6 +1262,13 @@
    "@types/source-list-map" "*"
    source-map "^0.7.3"

+"@types/webpack-subresource-integrity@^1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@types/webpack-subresource-integrity/-/webpack-subresource-integrity-1.2.0.tgz#0051c6b0abec61929889e66964668303528c3525"
+  integrity sha512-J3JTXySjghrFIWs3/iNnSXAQ9aK+jDyy+F2/jfBiWPXhz4ZBm80Vi1t1p2Ef6h0g0c4TCg7M36R/J81GEDQ6zg==
+  dependencies:
+    "@types/webpack" "*"
+
 "@types/webpack@*", "@types/webpack@^4.41.8":
  version "4.41.21"
  resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.41.21.tgz#cc685b332c33f153bb2f5fc1fa3ac8adeb592dee"
@@ -1851,6 +1858,11 @@ bcrypt-pbkdf@^1.0.0:
  dependencies:
    tweetnacl "^0.14.3"

+big.js@^3.1.3:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
+  integrity sha512-+hN/Zh2D08Mx65pZ/4g5bsmNiZUuChDiQfTUQ7qJr4/kuopCr88xZsAXv6mBoZEsUI4OuGHlX59qE94K2mMW8Q==
+
 big.js@^5.2.2:
  version "5.2.2"
  resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
@@ -2895,6 +2907,11 @@ deep-equal@^1.0.1:
    object-keys "^1.1.1"
    regexp.prototype.flags "^1.2.0"

+deep-extend@^0.5.1:
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.5.1.tgz#b894a9dd90d3023fbf1c55a394fb858eb2066f1f"
+  integrity sha512-N8vBdOa+DF7zkRrDCsaOXoCs/E2fJfx9B9MrKnnSiHNh4ws7eSys6YQE4KvT1cecKmOASYQBhbKjeuDD9lT81w==
+
 deep-is@~0.1.3:
  version "0.1.3"
  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
@@ -3149,6 +3166,11 @@ ee-first@1.1.1:
  resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
  integrity sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=

+ejs@^2.3.4:
+  version "2.7.4"
+  resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.7.4.tgz#48661287573dcc53e366c7a1ae52c3a120eec9ba"
+  integrity sha512-7vmuyh5+kuUyJKePhQfRQBhXV5Ce+RnaeeQArKu1EAMpL3WbgMt5WG6uQZpEVvYSSsxMXRKOewtDk9RaTKXRlA==
+
 electron-to-chromium@^1.3.523:
  version "1.3.537"
  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.537.tgz#dfe595f5283d3113df897158810e40f6c2355283"
@@ -3172,6 +3194,11 @@ emoji-regex@^7.0.1:
  resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-7.0.3.tgz#933a04052860c85e83c122479c4748a8e4c72156"
  integrity sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA==

+emojis-list@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
+  integrity sha1-TapNnbAPmBmIDHn6RXrlsJof04k=
+
 emojis-list@^3.0.0:
  version "3.0.0"
  resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
@@ -4660,6 +4687,11 @@ json3@^3.3.2:
  resolved "https://registry.yarnpkg.com/json3/-/json3-3.3.3.tgz#7fc10e375fc5ae42c4705a5cc0aa6f62be305b81"
  integrity sha512-c7/8mbUsKigAbLkD5B010BK4D9LZm7A1pNItkEwiUZRpIN66exu/e7YQWysGun+TRKaJp8MhemM+VkfWv42aCA==

+json5@^0.5.0:
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
+  integrity sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE=
+
 json5@^1.0.1:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe"
@@ -4738,6 +4770,16 @@ loader-runner@^2.4.0:
  resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357"
  integrity sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw==

+loader-utils@0.2.x:
+  version "0.2.17"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-0.2.17.tgz#f86e6374d43205a6e6c60e9196f17c0299bfb348"
+  integrity sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=
+  dependencies:
+    big.js "^3.1.3"
+    emojis-list "^2.0.0"
+    json5 "^0.5.0"
+    object-assign "^4.0.1"
+
 loader-utils@^1.1.0, loader-utils@^1.2.3, loader-utils@^1.4.0:
  version "1.4.0"
  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
@@ -5003,7 +5045,7 @@ minimalistic-crypto-utils@^1.0.0, minimalistic-crypto-utils@^1.0.1:
  resolved "https://registry.yarnpkg.com/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz#f6c00c1c0b082246e5c4d99dfb8c7c083b2b582a"
  integrity sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo=

-minimatch@^3.0.4:
+minimatch@^3.0.3, minimatch@^3.0.4:
  version "3.0.4"
  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
  integrity sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==
@@ -5332,6 +5374,17 @@ obuf@^1.0.0, obuf@^1.1.2:
  resolved "https://registry.yarnpkg.com/obuf/-/obuf-1.1.2.tgz#09bea3343d41859ebd446292d11c9d4db619084e"
  integrity sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==

+offline-plugin@^5.0.7:
+  version "5.0.7"
+  resolved "https://registry.yarnpkg.com/offline-plugin/-/offline-plugin-5.0.7.tgz#26936ad1a7699f4d67e0a095a258972a4ccf1788"
+  integrity sha512-ArMFt4QFjK0wg8B5+R/6tt65u6Dk+Pkx4PAcW5O7mgIF3ywMepaQqFOQgfZD4ybanuGwuJihxUwMRgkzd+YGYw==
+  dependencies:
+    deep-extend "^0.5.1"
+    ejs "^2.3.4"
+    loader-utils "0.2.x"
+    minimatch "^3.0.3"
+    slash "^1.0.0"
+
 omit.js@^2.0.0, omit.js@^2.0.2:
  version "2.0.2"
  resolved "https://registry.yarnpkg.com/omit.js/-/omit.js-2.0.2.tgz#dd9b8436fab947a5f3ff214cb2538631e313ec2f"
@@ -7252,6 +7305,11 @@ simple-swizzle@^0.2.2:
  dependencies:
    is-arrayish "^0.3.1"

+slash@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
+  integrity sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=
+
 slide@^1.1.5:
  version "1.1.6"
  resolved "https://registry.yarnpkg.com/slide/-/slide-1.1.6.tgz#56eb027d65b4d2dce6cb2e2d32c4d4afc9e1d707"
@@ -8219,7 +8277,7 @@ webpack-log@^2.0.0:
    ansi-colors "^3.0.0"
    uuid "^3.3.2"

-webpack-sources@^1.4.0, webpack-sources@^1.4.1:
+webpack-sources@^1.3.0, webpack-sources@^1.4.0, webpack-sources@^1.4.1:
  version "1.4.3"
  resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-1.4.3.tgz#eedd8ec0b928fbf1cbfe994e22d2d890f330a933"
  integrity sha512-lgTS3Xhv1lCOKo7SA5TjKXMjpSM4sBjNV5+q2bqesbSPs5FjGmU6jjtBSkX9b4qW87vDIsCIlUPOEhbZrMdjeQ==
@@ -8227,6 +8285,13 @@ webpack-sources@^1.4.0, webpack-sources@^1.4.1:
    source-list-map "^2.0.0"
    source-map "~0.6.1"

+webpack-subresource-integrity@^1.4.1:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/webpack-subresource-integrity/-/webpack-subresource-integrity-1.4.1.tgz#e8bf918b444277df46a66cd84542cbcdc5a6272d"
+  integrity sha512-XMLFInbGbB1HV7K4vHWANzc1CN0t/c4bBvnlvGxGwV45yE/S/feAXIm8dJsCkzqWtSKnmaEgTp/meyeThxG4Iw==
+  dependencies:
+    webpack-sources "^1.3.0"
+
 webpack@^4.44.1:
  version "4.44.1"
  resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.44.1.tgz#17e69fff9f321b8f117d1fda714edfc0b939cc21"