diff --git a/frontend/src/assets/NotFound.tsx b/frontend/src/assets/NotFound.tsx new file mode 100644 index 0000000000..951ab8b15a --- /dev/null +++ b/frontend/src/assets/NotFound.tsx @@ -0,0 +1,266 @@ +import React from "react"; + +const NotFound = (): JSX.Element => { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +}; + +export default NotFound; diff --git a/frontend/src/components/NotFound/index.tsx b/frontend/src/components/NotFound/index.tsx new file mode 100644 index 0000000000..a2fc5dcc35 --- /dev/null +++ b/frontend/src/components/NotFound/index.tsx @@ -0,0 +1,25 @@ +import React from "react"; + +import { Button, Text, TextContainer, Container } from "./styles"; + +import NotFoundImage from "Src/assets/NotFound"; +import ROUTES from "Src/constants/routes"; + +const NotFound = (): JSX.Element => { + return ( + + + + + Ah, seems like we reached a dead end! + Page Not Found + + + + + ); +}; + +export default NotFound; diff --git a/frontend/src/components/NotFound/styles.ts b/frontend/src/components/NotFound/styles.ts new file mode 100644 index 0000000000..6de8e68643 --- /dev/null +++ b/frontend/src/components/NotFound/styles.ts @@ -0,0 +1,61 @@ +import styled from "styled-components"; +import { Link } from "react-router-dom"; + +export const Button = styled(Link)` + height: 100%; + border: 2px solid #2f80ed; + box-sizing: border-box; + border-radius: 10px; + width: 400px; + + background: inherit; + + font-style: normal; + font-weight: normal; + font-size: 24px; + line-height: 20px; + + display: flex; + align-items: center; + justify-content: center; + padding-top: 14px; + padding-bottom: 14px; + + color: #2f80ed; +`; + +export const Container = styled.div` + min-height: 80vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +`; + +export const Text = styled.p` + font-style: normal; + font-weight: 300; + font-size: 18px; + line-height: 20px; + + display: flex; + align-items: center; + text-align: center; + + color: #828282; + text-align: center; + margin: 0; + + display: flex; + justify-content: center; + align-items: center; +`; + +export const TextContainer = styled.div` + min-height: 50px; + display: flex; + justify-content: space-between; + flex-direction: column; + margin-bottom: 30px; + margin-top: 20px; +`; diff --git a/frontend/src/modules/AppWrapper.tsx b/frontend/src/modules/AppWrapper.tsx index ac58479eb1..25dd23ed2b 100644 --- a/frontend/src/modules/AppWrapper.tsx +++ b/frontend/src/modules/AppWrapper.tsx @@ -15,64 +15,54 @@ import { ServicesTable, Signup, SettingsPage, - IntstrumentationPage, + InstrumentationPage, } from "Src/pages"; import { RouteProvider } from "./RouteProvider"; +import NotFound from "Src/components/NotFound"; const App = () => { const { status } = useThemeSwitcher(); if (status === "loading") { - return null; + return ; } return ( - }> - - - - - }> - - - - - - - - - - { - return localStorage.getItem(IS_LOGGED_IN) === "yes" ? ( - - ) : ( - - ); - }} - /> - + + + }> + + + + + + + + + + + { + return localStorage.getItem(IS_LOGGED_IN) === "yes" ? ( + + ) : ( + + ); + }} + /> - - - - - + + + + + ); }; diff --git a/frontend/src/modules/BaseLayout.tsx b/frontend/src/modules/BaseLayout.tsx index 2afa2fcac8..5fe2691d68 100644 --- a/frontend/src/modules/BaseLayout.tsx +++ b/frontend/src/modules/BaseLayout.tsx @@ -29,7 +29,7 @@ const BaseLayout: React.FC = ({ children }) => { {children}
- SigNoz Inc. ©2020{" "} + SigNoz Inc. ©2020
diff --git a/frontend/src/modules/Test.tsx b/frontend/src/modules/Test.tsx deleted file mode 100644 index 04061e803b..0000000000 --- a/frontend/src/modules/Test.tsx +++ /dev/null @@ -1,5 +0,0 @@ -const Test = () => { - return
INSIDE PUBLIC CODE
; -}; - -export default Test; diff --git a/frontend/src/pages.ts b/frontend/src/pages.ts index fb9012df78..10dfe98932 100644 --- a/frontend/src/pages.ts +++ b/frontend/src/pages.ts @@ -23,6 +23,6 @@ export const SettingsPage = React.lazy( () => import("Src/modules/Settings/settingsPage"), ); -export const IntstrumentationPage = React.lazy( +export const InstrumentationPage = React.lazy( () => import("Src/modules/add-instrumentation/instrumentationPage"), ); diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js index bc531b2b6c..6e4a077a47 100644 --- a/frontend/webpack.config.js +++ b/frontend/webpack.config.js @@ -61,6 +61,9 @@ module.exports = { }, plugins: [ new HtmlWebpackPlugin({ template: "src/index.html.ejs" }), + new webpack.ProvidePlugin({ + process: "process/browser", + }), new webpack.DefinePlugin({ "process.env": JSON.stringify(process.env), }), diff --git a/frontend/webpack.config.prod.js b/frontend/webpack.config.prod.js index d9bd801f78..0d9bdae721 100644 --- a/frontend/webpack.config.prod.js +++ b/frontend/webpack.config.prod.js @@ -3,6 +3,7 @@ const { resolve } = require("path"); const HtmlWebpackPlugin = require("html-webpack-plugin"); const CopyPlugin = require("copy-webpack-plugin"); const CompressionPlugin = require("compression-webpack-plugin"); +const webpack = require("webpack"); module.exports = { mode: "production", @@ -52,6 +53,12 @@ module.exports = { new CopyPlugin({ patterns: [{ from: resolve(__dirname, "public/"), to: "." }], }), + new webpack.ProvidePlugin({ + process: "process/browser", + }), + new webpack.DefinePlugin({ + "process.env": JSON.stringify(process.env), + }), ], performance: { hints: false, diff --git a/node_modules/.yarn-integrity b/node_modules/.yarn-integrity deleted file mode 100644 index 0f19eb7ab3..0000000000 --- a/node_modules/.yarn-integrity +++ /dev/null @@ -1,10 +0,0 @@ -{ - "systemParams": "darwin-x64-83", - "modulesFolders": [], - "flags": [], - "linkedModules": [], - "topLevelPatterns": [], - "lockfileEntries": {}, - "files": [], - "artifacts": {} -} \ No newline at end of file