From c5241e00f906f889d71a5bc50e0dc1d24fd5b303 Mon Sep 17 00:00:00 2001 From: "@wwwjim" Date: Wed, 15 Jul 2020 22:48:51 -0700 Subject: [PATCH] cleanup: imports and site navigation --- electron/main.js | 6 +- ...mponent-module-test.js => _system-test.js} | 2 +- pages/application.js | 407 +++++++++++++++++ pages/index.js | 432 ++---------------- pages/system/card-tabs.js | 2 +- pages/system/checkboxes.js | 2 +- pages/system/datepicker.js | 1 - pages/system/list-editor.js | 1 - pages/system/modals.js | 2 +- pages/system/notifications.js | 2 +- pages/system/radios.js | 2 +- pages/system/tabs.js | 2 +- pages/system/tooltips.js | 2 +- server.js | 12 +- 14 files changed, 471 insertions(+), 404 deletions(-) rename pages/{component-module-test.js => _system-test.js} (90%) create mode 100644 pages/application.js diff --git a/electron/main.js b/electron/main.js index d9a148ad..f2f10b34 100644 --- a/electron/main.js +++ b/electron/main.js @@ -37,6 +37,8 @@ function createWindow() { // Open the DevTools. mainWindow.webContents.openDevTools(); // and load the index.html of the app. + // TODO(jim): + // We shouldn't hardcode this port. mainWindow.loadURL("http://localhost:1337"); console.log("window created"); } @@ -49,7 +51,7 @@ app.whenReady().then(() => { bootServer(); createWindow(); - app.on("activate", function () { + app.on("activate", function() { // On macOS it's common to re-create a window in the app when the // dock icon is clicked and there are no other windows open. if (BrowserWindow.getAllWindows().length === 0) createWindow(); @@ -59,7 +61,7 @@ app.whenReady().then(() => { // Quit when all windows are closed, except on macOS. There, it's common // for applications and their menu bar to stay active until the user quits // explicitly with Cmd + Q. -app.on("window-all-closed", function () { +app.on("window-all-closed", function() { if (process.platform !== "darwin") app.quit(); }); diff --git a/pages/component-module-test.js b/pages/_system-test.js similarity index 90% rename from pages/component-module-test.js rename to pages/_system-test.js index a499e315..66fbfeab 100644 --- a/pages/component-module-test.js +++ b/pages/_system-test.js @@ -1,7 +1,7 @@ import * as React from "react"; import * as System from "../dist"; -export default class TestPage extends React.Component { +export default class SlateReactSystemPage extends React.Component { render() { console.log(System.Constants); diff --git a/pages/application.js b/pages/application.js new file mode 100644 index 00000000..df547d32 --- /dev/null +++ b/pages/application.js @@ -0,0 +1,407 @@ +import * as React from "react"; +import * as NavigationData from "~/common/navigation-data"; +import * as Actions from "~/common/actions"; +import * as State from "~/common/state"; + +import SceneDataTransfer from "~/scenes/SceneDataTransfer"; +import SceneDeals from "~/scenes/SceneDeals"; +import SceneEditAccount from "~/scenes/SceneEditAccount"; +import SceneFile from "~/scenes/SceneFile"; +import SceneFilesFolder from "~/scenes/SceneFilesFolder"; +import SceneHome from "~/scenes/SceneHome"; +import SceneLogs from "~/scenes/SceneLogs"; +import SceneMiners from "~/scenes/SceneMiners"; +import ScenePaymentChannels from "~/scenes/ScenePaymentChannels"; +import ScenePeers from "~/scenes/ScenePeers"; +import SceneSettings from "~/scenes/SceneSettings"; +import SceneStats from "~/scenes/SceneStats"; +import SceneStatus from "~/scenes/SceneStatus"; +import SceneStorageMarket from "~/scenes/SceneStorageMarket"; +import SceneWallet from "~/scenes/SceneWallet"; +import SceneSlates from "~/scenes/SceneSlates"; +import SceneSettingsDeveloper from "~/scenes/SceneSettingsDeveloper"; + +import SidebarCreateWalletAddress from "~/components/sidebars/SidebarCreateWalletAddress"; +import SidebarDeleteWalletAddress from "~/components/sidebars/SidebarDeleteWalletAddress"; +import SidebarWalletSendFunds from "~/components/sidebars/SidebarWalletSendFunds"; +import SidebarFileStorageDeal from "~/components/sidebars/SidebarFileStorageDeal"; +import SidebarFileRetrievalDeal from "~/components/sidebars/SidebarFileRetrievalDeal"; +import SidebarCreatePaymentChannel from "~/components/sidebars/SidebarCreatePaymentChannel"; +import SidebarAddMiner from "~/components/sidebars/SidebarAddMiner"; +import SidebarAddPeer from "~/components/sidebars/SidebarAddPeer"; +import SidebarNotifications from "~/components/sidebars/SidebarNotifications"; +import SidebarRedeemPaymentChannel from "~/components/sidebars/SidebarRedeemPaymentChannel"; + +import ApplicationNavigation from "~/components/core/ApplicationNavigation"; +import ApplicationHeader from "~/components/core/ApplicationHeader"; +import ApplicationLayout from "~/components/core/ApplicationLayout"; +import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper"; + +const getCurrentNavigationStateById = (navigation, targetId) => { + let target = null; + let activeIds = {}; + + const findById = (state, id) => { + for (let i = 0; i < state.length; i++) { + if (state[i].id === id) { + target = state[i]; + activeIds[state[i].id] = true; + } + + if (!target && state[i].children) { + activeIds[state[i].id] = true; + findById(state[i].children, id); + + if (!target) { + activeIds[state[i].id] = false; + } + } + } + }; + + findById(navigation, targetId); + + return { target, activeIds }; +}; + +export const getServerSideProps = async (context) => { + const data = await Actions.rehydrateViewer(); + + return { + props: { ...context.query, ...data.data }, + }; +}; + +export default class ApplicationPage extends React.Component { + _socket = null; + + state = { + history: [{ id: 1, scrollTop: 0 }], + currentIndex: 0, + data: null, + selected: State.getSelectedState(this.props), + viewer: State.getInitialState(this.props), + sidebar: null, + file: null, + }; + + componentDidMount() { + this._socket = new WebSocket(`ws://localhost:${this.props.wsPort}`); + this._socket.onmessage = (m) => { + console.log(m); + if (m.type === "message") { + const parsed = JSON.parse(m.data); + + if (parsed.action === "UPDATE_VIEWER") { + this.rehydrate({ data: parsed.data }); + } + } + }; + + window.addEventListener("dragenter", this._handleDragEnter); + window.addEventListener("dragleave", this._handleDragLeave); + window.addEventListener("dragover", this._handleDragOver); + window.addEventListener("drop", this._handleDrop); + } + + componentWillUnmount() { + window.removeEventListener("dragenter", this._handleDragEnter); + window.removeEventListener("dragleave", this._handleDragLeave); + window.removeEventListener("dragover", this._handleDragOver); + window.removeEventListener("drop", this._handleDrop); + } + + _handleSetFile = async ({ file }) => { + let data = new FormData(); + data.append("image", file); + + const options = { + method: "POST", + headers: { + Accept: "application/json", + }, + body: data, + }; + + const response = await fetch(`/_/storage/${file.name}`, options); + const json = await response.json(); + + if (json && json.success) { + this.setState({ file }); + } + }; + + _handleDragEnter = (e) => { + // TODO(jim): Styles. + console.log("dragenter", e); + }; + + _handleDragLeave = (e) => { + // TODO(jim): Styles. + console.log("dragleave", e); + }; + + _handleDragOver = (e) => { + e.preventDefault(); + console.log("dragover", e); + }; + + _handleDrop = async (e) => { + e.preventDefault(); + + if (e.dataTransfer.items) { + for (var i = 0; i < e.dataTransfer.items.length; i++) { + if (e.dataTransfer.items[i].kind === "file") { + var file = e.dataTransfer.items[i].getAsFile(); + console.log(file.name); + await this._handleSetFile({ file }); + break; + } + } + } + + this._handleAction({ type: "SIDEBAR", value: "SIDEBAR_FILE_STORAGE_DEAL" }); + }; + + rehydrate = async ({ data }) => { + this.setState({ viewer: { ...State.getInitialState(data) } }); + }; + + _handleSubmit = async (data) => { + if (this.props.production) { + alert("TODO"); + return this._handleDismissSidebar(); + } + + if (data.type === "CREATE_WALLET_ADDRESS") { + const address = await Actions.createWalletAddress({ + name: data.name, + type: data.wallet_type, + makeDefault: data.makeDefault, + }); + } + + if (data.type === "SEND_WALLET_ADDRESS_FILECOIN") { + const response = await Actions.sendWalletAddressFilecoin({ + source: data.source, + target: data.target, + amount: data.amount, + }); + } + + this._handleDismissSidebar(); + }; + + _handleCancel = () => { + this._handleDismissSidebar(); + }; + + _handleViewerChange = (e) => { + this.setState({ + viewer: { ...this.state.viewer, [e.target.name]: e.target.value }, + }); + }; + + _handleSelectedChange = (e) => { + this.setState({ + selected: { ...this.state.selected, [e.target.name]: e.target.value }, + }); + }; + + _handleDismissSidebar = () => { + this.setState({ sidebar: null }); + }; + + _handleAction = (options) => { + if (options.type === "NAVIGATE") { + return this._handleNavigateTo({ id: options.value }, options.data); + } + + if (options.type === "ACTION") { + return alert(JSON.stringify(options)); + } + + if (options.type === "DOWNLOAD") { + return alert(JSON.stringify(options)); + } + + if (options.type === "SIDEBAR") { + return this.setState({ sidebar: this.sidebars[options.value] }); + } + + return alert(JSON.stringify(options)); + }; + + _handleNavigateTo = (next, data = {}) => { + this.state.history[this.state.currentIndex].scrollTop = window.scrollY; + + if (this.state.currentIndex !== this.state.history.length - 1) { + const adjustedArray = [...this.state.history]; + adjustedArray.length = this.state.currentIndex + 1; + + return this.setState( + { + history: [...adjustedArray, next], + currentIndex: this.state.currentIndex + 1, + data, + }, + () => { + window.scrollTo(0, 0); + } + ); + } + + this.setState( + { + history: [...this.state.history, next], + currentIndex: this.state.currentIndex + 1, + data, + }, + () => { + window.scrollTo(0, 0); + } + ); + }; + + _handleBack = () => { + this.state.history[this.state.currentIndex].scrollTop = window.scrollY; + + this.setState( + { + currentIndex: this.state.currentIndex - 1, + }, + () => { + const next = this.state.history[this.state.currentIndex]; + console.log({ next }); + window.scrollTo(0, next.scrollTop); + } + ); + }; + + _handleForward = () => { + this.state.history[this.state.currentIndex].scrollTop = window.scrollY; + + this.setState( + { + currentIndex: this.state.currentIndex + 1, + }, + () => { + const next = this.state.history[this.state.currentIndex]; + console.log({ next }); + window.scrollTo(0, next.scrollTop); + } + ); + }; + + sidebars = { + SIDEBAR_NOTIFICATIONS: , + SIDEBAR_ADD_PEER: , + SIDEBAR_ADD_MINER: , + SIDEBAR_CREATE_PAYMENT_CHANNEL: , + SIDEBAR_FILE_STORAGE_DEAL: , + SIDEBAR_FILE_RETRIEVAL_DEAL: , + SIDEBAR_WALLET_SEND_FUNDS: , + SIDEBAR_CREATE_WALLET_ADDRESS: , + SIDEBAR_DELETE_WALLET_ADDRESS: , + SIDEBAR_REDEEM_PAYMENT_CHANNEL: , + }; + + scenes = { + HOME: , + WALLET: , + CHANNELS: , + FOLDER: , + FILE: , + DEALS: , + DATA_TRANSFER: , + STATS: , + STORAGE_MARKET: , + MINERS: , + STATUS: , + PEERS: , + LOGS: , + SETTINGS: , + SETTINGS_DEVELOPER: , + EDIT_ACCOUNT: , + SLATES: , + }; + + render() { + const navigation = NavigationData.generate(this.state.viewer.library); + const next = this.state.history[this.state.currentIndex]; + const current = getCurrentNavigationStateById(navigation, next.id); + + const navigationElement = ( + + ); + + const headerElement = ( + + ); + + const scene = React.cloneElement(this.scenes[current.target.decorator], { + viewer: this.state.viewer, + selected: this.state.selected, + data: current.target, + file: this.state.data, + onNavigateTo: this._handleNavigateTo, + onSelectedChange: this._handleSelectedChange, + onViewerChange: this._handleViewerChange, + onAction: this._handleAction, + onBack: this._handleBack, + onForward: this._handleForward, + }); + + let sidebarElement; + if (this.state.sidebar) { + sidebarElement = React.cloneElement(this.state.sidebar, { + file: this.state.file, + viewer: this.state.viewer, + selected: this.state.selected, + onSelectedChange: this._handleSelectedChange, + onSubmit: this._handleSubmit, + onCancel: this._handleCancel, + onSetFile: this._handleSetFile, + }); + } + + const title = `Prototype 0.0.1 : ${current.target.pageTitle}`; + const description = "This is an early preview."; + const url = "https://fps.onrender.com/v1"; + + return ( + + + + {scene} + + + + ); + } +} diff --git a/pages/index.js b/pages/index.js index 0928789d..21ef0510 100644 --- a/pages/index.js +++ b/pages/index.js @@ -1,407 +1,67 @@ import * as React from "react"; -import * as NavigationData from "~/common/navigation-data"; -import * as Actions from "~/common/actions"; -import * as State from "~/common/state"; +import * as Constants from "~/common/constants"; -import SceneDataTransfer from "~/scenes/SceneDataTransfer"; -import SceneDeals from "~/scenes/SceneDeals"; -import SceneEditAccount from "~/scenes/SceneEditAccount"; -import SceneFile from "~/scenes/SceneFile"; -import SceneFilesFolder from "~/scenes/SceneFilesFolder"; -import SceneHome from "~/scenes/SceneHome"; -import SceneLogs from "~/scenes/SceneLogs"; -import SceneMiners from "~/scenes/SceneMiners"; -import ScenePaymentChannels from "~/scenes/ScenePaymentChannels"; -import ScenePeers from "~/scenes/ScenePeers"; -import SceneSettings from "~/scenes/SceneSettings"; -import SceneStats from "~/scenes/SceneStats"; -import SceneStatus from "~/scenes/SceneStatus"; -import SceneStorageMarket from "~/scenes/SceneStorageMarket"; -import SceneWallet from "~/scenes/SceneWallet"; -import SceneSlates from "~/scenes/SceneSlates"; -import SceneSettingsDeveloper from "~/scenes/SceneSettingsDeveloper"; +import { css } from "@emotion/react"; -import SidebarCreateWalletAddress from "~/components/sidebars/SidebarCreateWalletAddress"; -import SidebarDeleteWalletAddress from "~/components/sidebars/SidebarDeleteWalletAddress"; -import SidebarWalletSendFunds from "~/components/sidebars/SidebarWalletSendFunds"; -import SidebarFileStorageDeal from "~/components/sidebars/SidebarFileStorageDeal"; -import SidebarFileRetrievalDeal from "~/components/sidebars/SidebarFileRetrievalDeal"; -import SidebarCreatePaymentChannel from "~/components/sidebars/SidebarCreatePaymentChannel"; -import SidebarAddMiner from "~/components/sidebars/SidebarAddMiner"; -import SidebarAddPeer from "~/components/sidebars/SidebarAddPeer"; -import SidebarNotifications from "~/components/sidebars/SidebarNotifications"; -import SidebarRedeemPaymentChannel from "~/components/sidebars/SidebarRedeemPaymentChannel"; - -import ApplicationNavigation from "~/components/core/ApplicationNavigation"; -import ApplicationHeader from "~/components/core/ApplicationHeader"; -import ApplicationLayout from "~/components/core/ApplicationLayout"; import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper"; -const getCurrentNavigationStateById = (navigation, targetId) => { - let target = null; - let activeIds = {}; +const STYLES_ROOT = css` + padding: 128px 88px 256px 88px; - const findById = (state, id) => { - for (let i = 0; i < state.length; i++) { - if (state[i].id === id) { - target = state[i]; - activeIds[state[i].id] = true; - } + @media (max-width: 768px) { + padding: 128px 24px 128px 24px; + } +`; - if (!target && state[i].children) { - activeIds[state[i].id] = true; - findById(state[i].children, id); +const STYLES_HEADING = css` + font-weight: 400; + font-size: 2.88rem; + line-height: 1.5; + color: ${Constants.system.black}; +`; - if (!target) { - activeIds[state[i].id] = false; - } - } - } - }; - - findById(navigation, targetId); - - return { target, activeIds }; -}; +const STYLES_PARAGRAPH = css` + font-weight: 400; + font-size: 2.88rem; + line-height: 1.5; + color: ${Constants.system.pitchBlack}; +`; export const getServerSideProps = async (context) => { - const data = await Actions.rehydrateViewer(); - return { - props: { ...context.query, ...data.data }, + props: { ...context.query }, }; }; export default class IndexPage extends React.Component { - _socket = null; - - state = { - history: [{ id: 1, scrollTop: 0 }], - currentIndex: 0, - data: null, - selected: State.getSelectedState(this.props), - viewer: State.getInitialState(this.props), - sidebar: null, - file: null, - }; - - componentDidMount() { - this._socket = new WebSocket(`ws://localhost:${this.props.wsPort}`); - this._socket.onmessage = (m) => { - console.log(m); - if (m.type === "message") { - const parsed = JSON.parse(m.data); - - if (parsed.action === "UPDATE_VIEWER") { - this.rehydrate({ data: parsed.data }); - } - } - }; - - window.addEventListener("dragenter", this._handleDragEnter); - window.addEventListener("dragleave", this._handleDragLeave); - window.addEventListener("dragover", this._handleDragOver); - window.addEventListener("drop", this._handleDrop); - } - - componentWillUnmount() { - window.removeEventListener("dragenter", this._handleDragEnter); - window.removeEventListener("dragleave", this._handleDragLeave); - window.removeEventListener("dragover", this._handleDragOver); - window.removeEventListener("drop", this._handleDrop); - } - - _handleSetFile = async ({ file }) => { - let data = new FormData(); - data.append("image", file); - - const options = { - method: "POST", - headers: { - Accept: "application/json", - }, - body: data, - }; - - const response = await fetch(`/_/storage/${file.name}`, options); - const json = await response.json(); - - if (json && json.success) { - this.setState({ file }); - } - }; - - _handleDragEnter = (e) => { - // TODO(jim): Styles. - console.log("dragenter", e); - }; - - _handleDragLeave = (e) => { - // TODO(jim): Styles. - console.log("dragleave", e); - }; - - _handleDragOver = (e) => { - e.preventDefault(); - console.log("dragover", e); - }; - - _handleDrop = async (e) => { - e.preventDefault(); - - if (e.dataTransfer.items) { - for (var i = 0; i < e.dataTransfer.items.length; i++) { - if (e.dataTransfer.items[i].kind === "file") { - var file = e.dataTransfer.items[i].getAsFile(); - console.log(file.name); - await this._handleSetFile({ file }); - break; - } - } - } - - this._handleAction({ type: "SIDEBAR", value: "SIDEBAR_FILE_STORAGE_DEAL" }); - }; - - rehydrate = async ({ data }) => { - this.setState({ viewer: { ...State.getInitialState(data) } }); - }; - - _handleSubmit = async (data) => { - if (this.props.production) { - alert("TODO"); - return this._handleDismissSidebar(); - } - - if (data.type === "CREATE_WALLET_ADDRESS") { - const address = await Actions.createWalletAddress({ - name: data.name, - type: data.wallet_type, - makeDefault: data.makeDefault, - }); - } - - if (data.type === "SEND_WALLET_ADDRESS_FILECOIN") { - const response = await Actions.sendWalletAddressFilecoin({ - source: data.source, - target: data.target, - amount: data.amount, - }); - } - - this._handleDismissSidebar(); - }; - - _handleCancel = () => { - this._handleDismissSidebar(); - }; - - _handleViewerChange = (e) => { - this.setState({ - viewer: { ...this.state.viewer, [e.target.name]: e.target.value }, - }); - }; - - _handleSelectedChange = (e) => { - this.setState({ - selected: { ...this.state.selected, [e.target.name]: e.target.value }, - }); - }; - - _handleDismissSidebar = () => { - this.setState({ sidebar: null }); - }; - - _handleAction = (options) => { - if (options.type === "NAVIGATE") { - return this._handleNavigateTo({ id: options.value }, options.data); - } - - if (options.type === "ACTION") { - return alert(JSON.stringify(options)); - } - - if (options.type === "DOWNLOAD") { - return alert(JSON.stringify(options)); - } - - if (options.type === "SIDEBAR") { - return this.setState({ sidebar: this.sidebars[options.value] }); - } - - return alert(JSON.stringify(options)); - }; - - _handleNavigateTo = (next, data = {}) => { - this.state.history[this.state.currentIndex].scrollTop = window.scrollY; - - if (this.state.currentIndex !== this.state.history.length - 1) { - const adjustedArray = [...this.state.history]; - adjustedArray.length = this.state.currentIndex + 1; - - return this.setState( - { - history: [...adjustedArray, next], - currentIndex: this.state.currentIndex + 1, - data, - }, - () => { - window.scrollTo(0, 0); - } - ); - } - - this.setState( - { - history: [...this.state.history, next], - currentIndex: this.state.currentIndex + 1, - data, - }, - () => { - window.scrollTo(0, 0); - } - ); - }; - - _handleBack = () => { - this.state.history[this.state.currentIndex].scrollTop = window.scrollY; - - this.setState( - { - currentIndex: this.state.currentIndex - 1, - }, - () => { - const next = this.state.history[this.state.currentIndex]; - console.log({ next }); - window.scrollTo(0, next.scrollTop); - } - ); - }; - - _handleForward = () => { - this.state.history[this.state.currentIndex].scrollTop = window.scrollY; - - this.setState( - { - currentIndex: this.state.currentIndex + 1, - }, - () => { - const next = this.state.history[this.state.currentIndex]; - console.log({ next }); - window.scrollTo(0, next.scrollTop); - } - ); - }; - - sidebars = { - SIDEBAR_NOTIFICATIONS: , - SIDEBAR_ADD_PEER: , - SIDEBAR_ADD_MINER: , - SIDEBAR_CREATE_PAYMENT_CHANNEL: , - SIDEBAR_FILE_STORAGE_DEAL: , - SIDEBAR_FILE_RETRIEVAL_DEAL: , - SIDEBAR_WALLET_SEND_FUNDS: , - SIDEBAR_CREATE_WALLET_ADDRESS: , - SIDEBAR_DELETE_WALLET_ADDRESS: , - SIDEBAR_REDEEM_PAYMENT_CHANNEL: , - }; - - scenes = { - HOME: , - WALLET: , - CHANNELS: , - FOLDER: , - FILE: , - DEALS: , - DATA_TRANSFER: , - STATS: , - STORAGE_MARKET: , - MINERS: , - STATUS: , - PEERS: , - LOGS: , - SETTINGS: , - SETTINGS_DEVELOPER: , - EDIT_ACCOUNT: , - SLATES: , - }; - render() { - const navigation = NavigationData.generate(this.state.viewer.library); - const next = this.state.history[this.state.currentIndex]; - const current = getCurrentNavigationStateById(navigation, next.id); - - const navigationElement = ( - - ); - - const headerElement = ( - - ); - - const scene = React.cloneElement(this.scenes[current.target.decorator], { - viewer: this.state.viewer, - selected: this.state.selected, - data: current.target, - file: this.state.data, - onNavigateTo: this._handleNavigateTo, - onSelectedChange: this._handleSelectedChange, - onViewerChange: this._handleViewerChange, - onAction: this._handleAction, - onBack: this._handleBack, - onForward: this._handleForward, - }); - - let sidebarElement; - if (this.state.sidebar) { - sidebarElement = React.cloneElement(this.state.sidebar, { - file: this.state.file, - viewer: this.state.viewer, - selected: this.state.selected, - onSelectedChange: this._handleSelectedChange, - onSubmit: this._handleSubmit, - onCancel: this._handleCancel, - onSetFile: this._handleSetFile, - }); - } - - const title = `Prototype 0.0.1 : ${current.target.pageTitle}`; - const description = "This is an early preview."; - const url = "https://fps.onrender.com/v1"; + const title = `Slate`; + const description = + "Tne place for all of your assets, slates. Powered by Textile and Filecoin."; + const url = "https://slate.host"; return ( - - - - {scene} - - - + +
+

Slate

+

+ One place for all of your assets, slates. Powered by{" "} + Textile and{" "} + Filecoin. +
+
+ {!this.props.hide ? ( + Test Application + ) : null} +
+ View Design System +

+
+ ); } } diff --git a/pages/system/card-tabs.js b/pages/system/card-tabs.js index f5bd2e30..ed752252 100644 --- a/pages/system/card-tabs.js +++ b/pages/system/card-tabs.js @@ -1,8 +1,8 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; import * as Constants from "~/common/constants"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/checkboxes.js b/pages/system/checkboxes.js index dfa60d13..f0d86f23 100644 --- a/pages/system/checkboxes.js +++ b/pages/system/checkboxes.js @@ -1,8 +1,8 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; import * as Constants from "~/common/constants"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/datepicker.js b/pages/system/datepicker.js index ff5155aa..27876804 100644 --- a/pages/system/datepicker.js +++ b/pages/system/datepicker.js @@ -3,7 +3,6 @@ import * as System from "~/components/system"; import * as Constants from "~/common/constants"; import moment from "moment"; - import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/list-editor.js b/pages/system/list-editor.js index 5a5239ff..b3f3d0fb 100644 --- a/pages/system/list-editor.js +++ b/pages/system/list-editor.js @@ -3,7 +3,6 @@ import * as System from "~/components/system"; import * as Constants from "~/common/constants"; import moment from "moment"; - import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/modals.js b/pages/system/modals.js index d45573f8..e6c3bda3 100644 --- a/pages/system/modals.js +++ b/pages/system/modals.js @@ -1,8 +1,8 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; import * as Constants from "~/common/constants"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/notifications.js b/pages/system/notifications.js index 2a8fd233..03242636 100644 --- a/pages/system/notifications.js +++ b/pages/system/notifications.js @@ -1,8 +1,8 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; import * as Constants from "~/common/constants"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/radios.js b/pages/system/radios.js index 669013bc..7cb28f39 100644 --- a/pages/system/radios.js +++ b/pages/system/radios.js @@ -1,8 +1,8 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; import * as Constants from "~/common/constants"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/tabs.js b/pages/system/tabs.js index d2f0ab04..c8ece7e2 100644 --- a/pages/system/tabs.js +++ b/pages/system/tabs.js @@ -1,8 +1,8 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; import * as Constants from "~/common/constants"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/pages/system/tooltips.js b/pages/system/tooltips.js index dc62e585..552cbd4e 100644 --- a/pages/system/tooltips.js +++ b/pages/system/tooltips.js @@ -1,7 +1,7 @@ import * as React from "react"; import * as System from "~/components/system"; -import Group from "~/components/system/Group"; +import Group from "~/components/system/Group"; import SystemPage from "~/components/system/SystemPage"; import ViewSourceLink from "~/components/system/ViewSourceLink"; diff --git a/server.js b/server.js index d9bc8be3..e7fe3c14 100644 --- a/server.js +++ b/server.js @@ -416,16 +416,16 @@ app.prepare().then(async () => { .send({ success: true, data: { ...data, ...req.body } }); }); - server.get("/", async (req, res) => { - if (productionWeb) { - return res.redirect("/system"); - } - - return app.render(req, res, "/", { + server.get("/application", async (req, res) => { + return app.render(req, res, "/application", { wsPort, }); }); + server.get("/", async (req, res) => { + return app.render(req, res, "/", { hide: productionWeb }); + }); + server.get("*", async (req, res) => { return nextRequestHandler(req, res, req.url); });