Skip to content

Commit

Permalink
build(deps): update dependencies and eject web for more flexibility
Browse files Browse the repository at this point in the history
  • Loading branch information
ph1p committed Jul 3, 2022
1 parent d5e7edf commit 3c991ae
Show file tree
Hide file tree
Showing 23 changed files with 6,403 additions and 9,462 deletions.
60 changes: 29 additions & 31 deletions packages/plugin/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,55 +22,53 @@
"license": "ISC",
"dependencies": {
"@fc/shared": "link:../shared/src",
"@giphy/js-fetch-api": "^4.1.2",
"@giphy/react-components": "^5.4.0",
"@giphy/js-fetch-api": "^4.3.1",
"@giphy/react-components": "^5.10.1",
"buffer": "^6.0.3",
"crypto-browserify": "^3.12.0",
"linkify-react": "^3.0.4",
"linkifyjs": "^3.0.4",
"mobx": "^6.3.8",
"mobx-react-lite": "^3.2.2",
"mobx": "^6.6.1",
"mobx-react-lite": "^3.4.0",
"mobx-sync": "^3.0.0",
"polished": "^4.1.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^6.1.1",
"polished": "^4.2.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.3.0",
"simple-encryptor": "^4.0.0",
"socket.io-client": "^4.4.0",
"socket.io-client": "^4.5.1",
"stream-browserify": "^3.0.0",
"styled-components": "^5.3.3",
"styled-components": "^5.3.5",
"tsconfig-paths-webpack-plugin": "^3.5.2",
"uniqid": "^5.4.0"
},
"devDependencies": {
"@figma/plugin-typings": "^1.39.1",
"@types/node": "^16.11.12",
"@types/react": "^17.0.37",
"@types/react-dom": "^17.0.11",
"@types/styled-components": "^5.1.18",
"@typescript-eslint/eslint-plugin": "^5.7.0",
"@typescript-eslint/parser": "^5.7.0",
"@figma/plugin-typings": "^1.49.0",
"@types/node": "^18.0.0",
"@types/react": "^18.0.14",
"@types/react-dom": "^18.0.5",
"@types/styled-components": "^5.1.25",
"@typescript-eslint/eslint-plugin": "^5.30.3",
"@typescript-eslint/parser": "^5.30.3",
"create-file-webpack": "^1.0.2",
"css-loader": "^6.5.1",
"esbuild-loader": "^2.17.0",
"eslint": "^8.4.1",
"eslint-config-prettier": "^8.3.0",
"css-loader": "^6.7.1",
"esbuild-loader": "^2.19.0",
"eslint": "^8.19.0",
"eslint-config-prettier": "^8.5.0",
"eslint-import-resolver-node": "^0.3.6",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-prefer-arrow": "^1.2.3",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.27.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-app": "^6.2.2",
"html-webpack-plugin": "^5.5.0",
"prettier": "^2.5.1",
"prettier": "^2.7.1",
"style-loader": "^3.3.1",
"terser-webpack-plugin": "v5.2.5",
"terser-webpack-plugin": "v5.3.3",
"tsconfig-paths-webpack-plugin": "^3.5.2",
"typescript": "^4.5.4",
"typescript": "^4.7.4",
"url-loader": "^4.1.1",
"webpack": "^5.65.0",
"webpack": "^5.73.0",
"webpack-bundle-analyzer": "^4.5.0",
"webpack-cli": "^4.9.1"
"webpack-cli": "^4.10.0"
},
"figmaPlugin": {
"name": "Figma Chat",
Expand Down
10 changes: 6 additions & 4 deletions packages/plugin/src/Ui.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import { toJS } from 'mobx';
import { observer } from 'mobx-react-lite';
import React, { useEffect, useState } from 'react';
import * as ReactDOM from 'react-dom';
import * as ReactDOM from 'react-dom/client';
import { createRoot } from 'react-dom/client';
import { MemoryRouter as Router, Route, Routes } from 'react-router-dom';
import io, { Socket } from 'socket.io-client';
import styled, { createGlobalStyle, ThemeProvider } from 'styled-components';
Expand Down Expand Up @@ -195,13 +196,14 @@ const App = observer(() => {
);
});

const root = createRoot(document.getElementById('app'));

getStoreFromMain().then((store) =>
trunk.init(store).then(() =>
ReactDOM.render(
root.render(
<StoreProvider>
<App />
</StoreProvider>,
document.getElementById('app')
</StoreProvider>
)
)
);
24 changes: 12 additions & 12 deletions packages/server/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,23 +11,23 @@
},
"license": "MIT",
"dependencies": {
"express": "^4.17.1",
"socket.io": "^4.4.0"
"express": "^4.18.1",
"socket.io": "^4.5.1"
},
"devDependencies": {
"@types/express": "^4.17.13",
"@typescript-eslint/eslint-plugin": "^5.7.0",
"@typescript-eslint/parser": "^5.7.0",
"eslint": "^8.4.1",
"eslint-config-prettier": "^8.3.0",
"@typescript-eslint/eslint-plugin": "^5.30.3",
"@typescript-eslint/parser": "^5.30.3",
"eslint": "^8.19.0",
"eslint-config-prettier": "^8.5.0",
"eslint-import-resolver-node": "^0.3.6",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-prefer-arrow": "^1.2.3",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.27.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-app": "^6.2.2",
"nodemon": "^2.0.15",
"prettier": "^2.5.1",
"typescript": "^4.5.4"
"nodemon": "^2.0.18",
"prettier": "^2.7.1",
"typescript": "^4.7.4"
}
}
50 changes: 26 additions & 24 deletions packages/shared/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,36 +3,38 @@
"version": "5.0.0",
"private": true,
"dependencies": {
"@popperjs/core": "^2.11.0",
"mobx": "^6.3.8",
"mobx-react-lite": "^3.2.2",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-popper": "^2.2.5",
"react-spring": "^9.3.2",
"react-timeago": "^6.2.1",
"socket.io-client": "^4.4.0",
"styled-components": "^5.3.3"
"@popperjs/core": "^2.11.5",
"linkify-react": "^3.0.4",
"linkifyjs": "^3.0.5",
"mobx": "^6.6.1",
"mobx-react-lite": "^3.4.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-popper": "^2.3.0",
"react-spring": "^9.4.5",
"react-timeago": "^7.1.0",
"socket.io-client": "^4.5.1",
"styled-components": "^5.3.5"
},
"devDependencies": {
"@types/node": "^16.11.12",
"@types/react": "^17.0.37",
"@types/react-dom": "^17.0.11",
"@types/react-router-dom": "^5.3.2",
"@types/node": "^18.0.0",
"@types/react": "^18.0.14",
"@types/react-dom": "^18.0.5",
"@types/react-router-dom": "^5.3.3",
"@types/react-timeago": "^4.1.3",
"@types/styled-components": "^5.1.18",
"@typescript-eslint/eslint-plugin": "^5.7.0",
"@typescript-eslint/parser": "^5.7.0",
"eslint": "^8.4.1",
"eslint-config-prettier": "^8.3.0",
"@types/styled-components": "^5.1.25",
"@typescript-eslint/eslint-plugin": "^5.30.3",
"@typescript-eslint/parser": "^5.30.3",
"eslint": "^8.19.0",
"eslint-config-prettier": "^8.5.0",
"eslint-import-resolver-node": "^0.3.6",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-prefer-arrow": "^1.2.3",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.27.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-app": "^6.2.2",
"prettier": "^2.5.1",
"typescript": "^4.5.4"
"prettier": "^2.7.1",
"typescript": "^4.7.4"
},
"scripts": {
"lint": "eslint --ext .tsx,.ts,.json,.js src/ --fix"
Expand Down
6 changes: 5 additions & 1 deletion packages/shared/src/components/Message.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,11 @@ const Message: FunctionComponent<Props> = observer(
</MessageTrash>
) : null}
<MessageDate className={`${isLocalMessage ? 'me' : colorClass}`}>
{date && <TimeAgo date={date} formatter={formatter} />}
{date && (
<>
<TimeAgo date={date} formatter={formatter} />
</>
)}
</MessageDate>
</MessageOptions>
</div>
Expand Down
43 changes: 0 additions & 43 deletions packages/web/config-overrides.js

This file was deleted.

104 changes: 104 additions & 0 deletions packages/web/config/env.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
'use strict';

const fs = require('fs');
const path = require('path');
const paths = require('./paths');

// Make sure that including paths.js after env.js will read .env variables.
delete require.cache[require.resolve('./paths')];

const NODE_ENV = process.env.NODE_ENV;
if (!NODE_ENV) {
throw new Error(
'The NODE_ENV environment variable is required but was not specified.'
);
}

// https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
const dotenvFiles = [
`${paths.dotenv}.${NODE_ENV}.local`,
// Don't include `.env.local` for `test` environment
// since normally you expect tests to produce the same
// results for everyone
NODE_ENV !== 'test' && `${paths.dotenv}.local`,
`${paths.dotenv}.${NODE_ENV}`,
paths.dotenv,
].filter(Boolean);

// Load environment variables from .env* files. Suppress warnings using silent
// if this file is missing. dotenv will never modify any environment variables
// that have already been set. Variable expansion is supported in .env files.
// https://github.com/motdotla/dotenv
// https://github.com/motdotla/dotenv-expand
dotenvFiles.forEach(dotenvFile => {
if (fs.existsSync(dotenvFile)) {
require('dotenv-expand').expand(
require('dotenv').config({
path: dotenvFile,
})
);
}
});

// We support resolving modules according to `NODE_PATH`.
// This lets you use absolute paths in imports inside large monorepos:
// https://github.com/facebook/create-react-app/issues/253.
// It works similar to `NODE_PATH` in Node itself:
// https://nodejs.org/api/modules.html#modules_loading_from_the_global_folders
// Note that unlike in Node, only *relative* paths from `NODE_PATH` are honored.
// Otherwise, we risk importing Node.js core modules into an app instead of webpack shims.
// https://github.com/facebook/create-react-app/issues/1023#issuecomment-265344421
// We also resolve them to make sure all tools using them work consistently.
const appDirectory = fs.realpathSync(process.cwd());
process.env.NODE_PATH = (process.env.NODE_PATH || '')
.split(path.delimiter)
.filter(folder => folder && !path.isAbsolute(folder))
.map(folder => path.resolve(appDirectory, folder))
.join(path.delimiter);

// Grab NODE_ENV and REACT_APP_* environment variables and prepare them to be
// injected into the application via DefinePlugin in webpack configuration.
const REACT_APP = /^REACT_APP_/i;

function getClientEnvironment(publicUrl) {
const raw = Object.keys(process.env)
.filter(key => REACT_APP.test(key))
.reduce(
(env, key) => {
env[key] = process.env[key];
return env;
},
{
// Useful for determining whether we’re running in production mode.
// Most importantly, it switches React into the correct mode.
NODE_ENV: process.env.NODE_ENV || 'development',
// Useful for resolving the correct path to static assets in `public`.
// For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
// This should only be used as an escape hatch. Normally you would put
// images into the `src` and `import` them in code to get their paths.
PUBLIC_URL: publicUrl,
// We support configuring the sockjs pathname during development.
// These settings let a developer run multiple simultaneous projects.
// They are used as the connection `hostname`, `pathname` and `port`
// in webpackHotDevClient. They are used as the `sockHost`, `sockPath`
// and `sockPort` options in webpack-dev-server.
WDS_SOCKET_HOST: process.env.WDS_SOCKET_HOST,
WDS_SOCKET_PATH: process.env.WDS_SOCKET_PATH,
WDS_SOCKET_PORT: process.env.WDS_SOCKET_PORT,
// Whether or not react-refresh is enabled.
// It is defined here so it is available in the webpackHotDevClient.
FAST_REFRESH: process.env.FAST_REFRESH !== 'false',
}
);
// Stringify all values so we can feed into webpack DefinePlugin
const stringified = {
'process.env': Object.keys(raw).reduce((env, key) => {
env[key] = JSON.stringify(raw[key]);
return env;
}, {}),
};

return { raw, stringified };
}

module.exports = getClientEnvironment;
Loading

0 comments on commit 3c991ae

Please sign in to comment.