From 19dc319381d78caa08ab4d9f67d548d68f02c29a Mon Sep 17 00:00:00 2001 From: Pranay Prateek Date: Thu, 7 Jan 2021 20:14:40 +0530 Subject: [PATCH 1/3] updated metric API URL --- frontend/src/api/metricsAPI.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/api/metricsAPI.js b/frontend/src/api/metricsAPI.js index 4ce1789b2e..ce09430ba3 100644 --- a/frontend/src/api/metricsAPI.js +++ b/frontend/src/api/metricsAPI.js @@ -1,9 +1,9 @@ import axios from 'axios'; export default axios.create({ - baseURL: 'http://104.211.113.204:8080/api/v1/', + // baseURL: 'http://104.211.113.204:8080/api/v1/', - // baseURL: 'http://localhost:3000/api/v1/', + baseURL: 'http://localhost:3000/api/v1/', } ); \ No newline at end of file From 8b12e15c0566719bd71c398082e5398e31f2f28f Mon Sep 17 00:00:00 2001 From: Pranay Prateek Date: Fri, 8 Jan 2021 20:48:18 +0530 Subject: [PATCH 2/3] basic signup with telgram ping on form submission --- frontend/src/api/metricsAPI.js | 4 +- frontend/src/api/submitForm.js | 14 ++ frontend/src/api/tracesAPI.js | 4 +- frontend/src/components/App.tsx | 6 +- frontend/src/components/AppWrapper.tsx | 34 ++++ frontend/src/components/Signup.tsx | 219 +++++++++++++++++++++++++ frontend/src/index.tsx | 14 +- 7 files changed, 288 insertions(+), 7 deletions(-) create mode 100644 frontend/src/api/submitForm.js create mode 100644 frontend/src/components/AppWrapper.tsx create mode 100644 frontend/src/components/Signup.tsx diff --git a/frontend/src/api/metricsAPI.js b/frontend/src/api/metricsAPI.js index c055d8a486..f60d642940 100644 --- a/frontend/src/api/metricsAPI.js +++ b/frontend/src/api/metricsAPI.js @@ -1,9 +1,9 @@ import axios from 'axios'; export default axios.create({ - // baseURL: 'http://104.211.113.204:8080/api/v1/', + baseURL: 'http://104.211.113.204:8080/api/v1/', // baseURL: process.env.REACT_APP_QUERY_SERVICE_URL, - baseURL: 'http://localhost:3000/api/v1/', + //baseURL: 'http://localhost:3000/api/v1/', // console.log('in metrics API', process.env.QUERY_SERVICE_URL) } diff --git a/frontend/src/api/submitForm.js b/frontend/src/api/submitForm.js new file mode 100644 index 0000000000..ad8e1af19f --- /dev/null +++ b/frontend/src/api/submitForm.js @@ -0,0 +1,14 @@ +import axios from 'axios'; + +export default axios.create({ + baseURL: 'https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/', + +} +); + + + +//https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/sendMessage?chat_id=351813222&text=Hello%20there + +// Chat ID can be obtained from here +//https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/getUpdates \ No newline at end of file diff --git a/frontend/src/api/tracesAPI.js b/frontend/src/api/tracesAPI.js index de8948b226..cedcedc4eb 100644 --- a/frontend/src/api/tracesAPI.js +++ b/frontend/src/api/tracesAPI.js @@ -2,10 +2,10 @@ import axios from 'axios'; //import { format } from 'path'; export default axios.create({ - // baseURL: 'http://104.211.113.204:8080/api/v1/' + baseURL: 'http://104.211.113.204:8080/api/v1/' //comment this line and remove this comment before pushing // baseURL: process.env.QUERY_SERVICE_URL, // console.log('in traces API', process.env.QUERY_SERVICE_URL) - baseURL: 'http://localhost:3000/api/v1/', + //baseURL: 'http://localhost:3000/api/v1/',//uncomment this line and remove this comment before pushing }); diff --git a/frontend/src/components/App.tsx b/frontend/src/components/App.tsx index e22dc786f3..8695c7de59 100644 --- a/frontend/src/components/App.tsx +++ b/frontend/src/components/App.tsx @@ -27,6 +27,8 @@ const TraceDetail = React.lazy(() => import('./traces/TraceDetail')); const TraceGraph = React.lazy(() => import ('./traces/TraceGraphDef' )); const UsageExplorer = React.lazy(() => import ('./usage/UsageExplorerDef' )); const ServicesTable = React.lazy(() => import('./metrics/ServicesTableDef')); +// const Signup = React.lazy(() => import('./Signup')); + //PNOTE @@ -54,6 +56,7 @@ const App = () => { return ( +
@@ -98,7 +101,8 @@ const App = () => { - + + {/* */} diff --git a/frontend/src/components/AppWrapper.tsx b/frontend/src/components/AppWrapper.tsx new file mode 100644 index 0000000000..21faff3a50 --- /dev/null +++ b/frontend/src/components/AppWrapper.tsx @@ -0,0 +1,34 @@ +import React,{Suspense} from 'react'; +import {Spin} from 'antd'; + + +import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; + + +const Signup = React.lazy(() => import('./Signup')); +const App = React.lazy(() => import('./App')); + + + +const AppWrapper = () => { + + return( + + + + }> + + + + + + + + + + ); + + +} + +export default AppWrapper; diff --git a/frontend/src/components/Signup.tsx b/frontend/src/components/Signup.tsx new file mode 100644 index 0000000000..c0f5c46fe1 --- /dev/null +++ b/frontend/src/components/Signup.tsx @@ -0,0 +1,219 @@ +import React, { useState,useRef, Suspense } from 'react'; +import { Row, Space, Button, Input, Checkbox } from 'antd' +import submitForm from '../api/submitForm'; +import axios from 'axios'; + + +const Signup = () => { + + const [state, setState] = useState({ submitted: false }) + const [formState, setFormState] = useState({ + firstName: {value:''}, + companyName: {value:''}, + email: {value:''}, + password: {value:'',valid:true}, + emailOptIn: { value: true }, + }) + const passwordInput = useRef(null) + // const { createAccount } = useActions(signupLogic) + // const { accountLoading } = useValues(signupLogic) + // const { plan } = fromParams() + + const updateForm = (name:any, target:any, valueAttr = 'value') => { + /* Validate password (if applicable) */ + if (name === 'password') { + let password = target[valueAttr] + const valid = password.length >= 8 + setFormState({ ...formState, password: { ...formState.password, valid, value: target[valueAttr] } }) + } else + if (name === 'firstName') { + + setFormState({ ...formState, firstName: { ...formState.firstName, value: target[valueAttr] } }) + } else + if (name === 'companyName') { + + setFormState({ ...formState, companyName: { ...formState.companyName, value: target[valueAttr] } }) + } else + if (name === 'email') { + + setFormState({ ...formState, email: { ...formState.email, value: target[valueAttr] } }) + } else + if (name === 'emailOptIn') { + + setFormState({ ...formState, emailOptIn: { ...formState.emailOptIn, value: target[valueAttr] } }) + } + } + + const handleSubmit = (e:any) => { + e.preventDefault() + + console.log('in handle submit'); + + setState({ ...state, submitted: true }) + + /* Password has custom validation */ + if (!formState.password.valid) { + // if (passwordInput.current){ + // passwordInput.current.focus() + // } + + // return + } + const payload = { + first_name: formState.firstName, + company_name: formState.companyName || undefined, + email: formState.email, + password: formState.password, + email_opt_in: formState.emailOptIn.value, + // plan, // Pass it along if on QS, won't have any effect unless on multitenancy + } + // createAccount(payload) + + + + // axios.get(`https://jsonplaceholder.typicode.com/users`) + // .then(res => { + // console.log(res); + // console.log(res.data); + // }) + let texttolog = JSON.stringify(payload) + + submitForm.get('sendMessage', { + params: { + chat_id: 351813222, + text:texttolog, + } + } + ).then(res => { + console.log(res); + console.log(res.data); + }) + }; + + + return ( +
+ +

+ {/* */} + Create your account +

+
Monitor your applications. Find what is causing issues.
+ + +
+ +
+
+
+
+ + updateForm('email', e.target)} + required + // disabled={accountLoading} + id="signupEmail" + /> +
+ +
+ + updateForm('password', e.target)} + required + ref={passwordInput} + // disabled={accountLoading} + id="signupPassword" + /> + }> + {/* */} + + {!formState.password && ( + Your password must have at least 8 characters. + )} +
+ +
+ + updateForm('firstName', e.target)} + required + // disabled={accountLoading} + id="signupFirstName" + /> +
+ +
+ + updateForm('companyName', e.target)} + // disabled={accountLoading} + id="signupCompanyName" + /> +
+ +
+ updateForm('emailOptIn', e.target, 'checked')} + // disabled={accountLoading} + > + Send me occasional emails about security and product updates. You may unsubscribe at any + time. + +
+
+ +
+ +
+ By clicking the button above you agree to our{' '} + + Terms of Service + {' '} + and{' '} + + Privacy Policy + + . +
+
+
+ +
+ + ); +} + +export default Signup; \ No newline at end of file diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx index 0dd4771c65..fe5d923d74 100644 --- a/frontend/src/index.tsx +++ b/frontend/src/index.tsx @@ -4,11 +4,14 @@ import { Provider } from 'react-redux'; import { createStore, applyMiddleware } from 'redux'; import { ThemeSwitcherProvider } from "react-css-theme-switcher"; import thunk from 'redux-thunk'; +// import { NavLink, BrowserRouter as Router, Route, Switch } from 'react-router-dom'; -import App from './components/App'; + +import AppWrapper from './components/AppWrapper'; import './assets/index.css'; import { reducers } from './reducers'; +// import Signup from './components/Signup'; const store = createStore(reducers, applyMiddleware(thunk)) @@ -21,7 +24,14 @@ ReactDOM.render( - + {/* + + + + + */} + + {/* */} , From 78e2feba7513fce115a195045cfd6ed2ed012019 Mon Sep 17 00:00:00 2001 From: Pranay Prateek Date: Sun, 10 Jan 2021 12:05:09 +0530 Subject: [PATCH 3/3] Updated signup page --- frontend/public/SigNoz-dark.svg | 1 + frontend/public/SigNoz-white.svg | 1 + frontend/src/api/metricsAPI.js | 3 +- frontend/src/api/submitForm.js | 4 +- frontend/src/components/App.tsx | 1 + frontend/src/components/AppWrapper.tsx | 25 ++++++++-- frontend/src/components/Signup.tsx | 48 ++++++++++++------- .../components/servicemap/ServiceGraph.tsx | 8 +++- .../src/components/servicemap/ServiceMap.tsx | 5 +- frontend/src/index.tsx | 7 +-- 10 files changed, 72 insertions(+), 31 deletions(-) create mode 100644 frontend/public/SigNoz-dark.svg create mode 100644 frontend/public/SigNoz-white.svg diff --git a/frontend/public/SigNoz-dark.svg b/frontend/public/SigNoz-dark.svg new file mode 100644 index 0000000000..41a6fb8258 --- /dev/null +++ b/frontend/public/SigNoz-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/public/SigNoz-white.svg b/frontend/public/SigNoz-white.svg new file mode 100644 index 0000000000..17cc833d12 --- /dev/null +++ b/frontend/public/SigNoz-white.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/src/api/metricsAPI.js b/frontend/src/api/metricsAPI.js index f60d642940..e43bd89983 100644 --- a/frontend/src/api/metricsAPI.js +++ b/frontend/src/api/metricsAPI.js @@ -1,10 +1,11 @@ import axios from 'axios'; export default axios.create({ - baseURL: 'http://104.211.113.204:8080/api/v1/', + // baseURL: 'http://104.211.113.204:8080/api/v1/', // baseURL: process.env.REACT_APP_QUERY_SERVICE_URL, //baseURL: 'http://localhost:3000/api/v1/', // console.log('in metrics API', process.env.QUERY_SERVICE_URL) + baseURL: '/api/v1/', } ); \ No newline at end of file diff --git a/frontend/src/api/submitForm.js b/frontend/src/api/submitForm.js index ad8e1af19f..46a65ae6de 100644 --- a/frontend/src/api/submitForm.js +++ b/frontend/src/api/submitForm.js @@ -1,7 +1,9 @@ import axios from 'axios'; export default axios.create({ - baseURL: 'https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/', + // baseURL: 'https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/', + // baseURL: 'http://104.211.113.204:8080/api/v1/', + baseURL: '/api/v1/', } ); diff --git a/frontend/src/components/App.tsx b/frontend/src/components/App.tsx index 8695c7de59..5b00987d12 100644 --- a/frontend/src/components/App.tsx +++ b/frontend/src/components/App.tsx @@ -102,6 +102,7 @@ const App = () => { + {/* */} diff --git a/frontend/src/components/AppWrapper.tsx b/frontend/src/components/AppWrapper.tsx index 21faff3a50..1b42f3f59f 100644 --- a/frontend/src/components/AppWrapper.tsx +++ b/frontend/src/components/AppWrapper.tsx @@ -1,8 +1,8 @@ -import React,{Suspense} from 'react'; +import React,{Suspense, useState} from 'react'; import {Spin} from 'antd'; -import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; +import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom'; const Signup = React.lazy(() => import('./Signup')); @@ -12,6 +12,8 @@ const App = React.lazy(() => import('./App')); const AppWrapper = () => { + const [isUserAuthenticated, setIsUserAuthenticated] = useState(false); + return( @@ -19,8 +21,25 @@ const AppWrapper = () => { }> + + + + + + - + { + return ( + localStorage.getItem('isLoggedIn')==='yes' ? + : + + ) + }} + + /> + + diff --git a/frontend/src/components/Signup.tsx b/frontend/src/components/Signup.tsx index c0f5c46fe1..c87163f1e4 100644 --- a/frontend/src/components/Signup.tsx +++ b/frontend/src/components/Signup.tsx @@ -1,10 +1,15 @@ import React, { useState,useRef, Suspense } from 'react'; import { Row, Space, Button, Input, Checkbox } from 'antd' import submitForm from '../api/submitForm'; -import axios from 'axios'; +import { withRouter } from "react-router"; +import { RouteComponentProps } from 'react-router-dom'; -const Signup = () => { +interface SignUpProps extends RouteComponentProps { + +} + +const Signup = (props:SignUpProps) => { const [state, setState] = useState({ submitted: false }) const [formState, setFormState] = useState({ @@ -76,18 +81,29 @@ const Signup = () => { // console.log(res); // console.log(res.data); // }) + let texttolog = JSON.stringify(payload) - submitForm.get('sendMessage', { - params: { - chat_id: 351813222, - text:texttolog, - } - } + // submitForm.get('sendMessage', { + // params: { + // chat_id: 351813222, + // text:texttolog, + // } + // } + // ).then(res => { + // console.log(res); + // console.log(res.data); + // }) + + + submitForm.post('user?email='+texttolog ).then(res => { console.log(res); console.log(res.data); }) + + localStorage.setItem('isLoggedIn', 'yes'); + props.history.push('/application') }; @@ -95,7 +111,7 @@ const Signup = () => {

- {/* */} + {/* */} Create your account

Monitor your applications. Find what is causing issues.
@@ -123,7 +139,7 @@ const Signup = () => {
updateForm('email', e.target)} @@ -154,7 +170,7 @@ const Signup = () => {
updateForm('firstName', e.target)} @@ -167,7 +183,7 @@ const Signup = () => {
updateForm('companyName', e.target)} // disabled={accountLoading} @@ -193,11 +209,11 @@ const Signup = () => { disabled={state.submitted && !formState.password} // loading={accountLoading} > - Create my account + Get Started
-
+ {/*
By clicking the button above you agree to our{' '} Terms of Service @@ -207,7 +223,7 @@ const Signup = () => { Privacy Policy . -
+
*/}
@@ -216,4 +232,4 @@ const Signup = () => { ); } -export default Signup; \ No newline at end of file +export default withRouter(Signup); \ No newline at end of file diff --git a/frontend/src/components/servicemap/ServiceGraph.tsx b/frontend/src/components/servicemap/ServiceGraph.tsx index 57652ea756..335ac15f4b 100644 --- a/frontend/src/components/servicemap/ServiceGraph.tsx +++ b/frontend/src/components/servicemap/ServiceGraph.tsx @@ -48,7 +48,8 @@ const ServiceGraph = () => { return ( -
Service Graph Component
+
Updated Service Graph module coming soon..
+ { // // if you want access to vis.js network api you can set the state in a parent component using this property // }} /> + ); @@ -64,4 +66,6 @@ const ServiceGraph = () => { -export default ServiceGraph; \ No newline at end of file +export default ServiceGraph; + + diff --git a/frontend/src/components/servicemap/ServiceMap.tsx b/frontend/src/components/servicemap/ServiceMap.tsx index 622c7b76d2..2919087b39 100644 --- a/frontend/src/components/servicemap/ServiceMap.tsx +++ b/frontend/src/components/servicemap/ServiceMap.tsx @@ -5,10 +5,11 @@ const ServiceMap = () => { return ( -
- +
Service Map module coming soon... + {/* */}
+ ); } diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx index fe5d923d74..354c54983f 100644 --- a/frontend/src/index.tsx +++ b/frontend/src/index.tsx @@ -24,12 +24,7 @@ ReactDOM.render( - {/* - - - - - */} + {/* */}