mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-10 17:33:24 +01:00
Refactor AppConfig
This commit is contained in:
parent
0d58fd5e90
commit
cb5c488263
@ -47,23 +47,7 @@
|
||||
<!--
|
||||
Dynamic runtime configuration properties (https://dev.to/matt_catalfamo/runtime-configurations-with-react-22dl)
|
||||
-->
|
||||
<script>
|
||||
(function (i, s, o, g, r, a, m) {
|
||||
i['GoogleAnalyticsObject'] = r;
|
||||
i[r] = i[r] || function () {
|
||||
(i[r].q = i[r].q || []).push(arguments)
|
||||
}, i[r].l = 1 * new Date();
|
||||
a = s.createElement(o),
|
||||
m = s.getElementsByTagName(o)[0];
|
||||
a.async = 1;
|
||||
a.src = g;
|
||||
m.parentNode.insertBefore(a, m)
|
||||
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
|
||||
|
||||
ga('create', 'UA-2347723-1', 'wisemapping.com');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
|
||||
|
||||
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
|
||||
<script>
|
||||
(adsbygoogle = window.adsbygoogle || []).push({
|
||||
|
@ -1,7 +1,6 @@
|
||||
import React, { ReactElement } from 'react';
|
||||
import { IntlProvider } from 'react-intl';
|
||||
import { Route, Switch, Redirect, BrowserRouter as Router } from 'react-router-dom';
|
||||
|
||||
import RegistrationSuccessPage from './components/registration-success-page';
|
||||
import ForgotPasswordSuccessPage from './components/forgot-password-success-page';
|
||||
import RegistationPage from './components/registration-page';
|
||||
@ -15,6 +14,10 @@ import AppI18n, { Locales } from './classes/app-i18n';
|
||||
import MapsPage from './components/maps-page';
|
||||
import CssBaseline from '@material-ui/core/CssBaseline';
|
||||
import { ThemeProvider } from '@material-ui/core/styles';
|
||||
import GoogleAnalytics from 'react-ga';
|
||||
|
||||
// Google Analytics Initialization.
|
||||
GoogleAnalytics.initialize('UA-0000000-0');
|
||||
|
||||
const queryClient = new QueryClient({
|
||||
defaultOptions: {
|
||||
|
68
packages/webapp/src/classes/server-config/index.ts
Normal file
68
packages/webapp/src/classes/server-config/index.ts
Normal file
@ -0,0 +1,68 @@
|
||||
import { sessionExpired } from "../../redux/clientSlice";
|
||||
import Client from "../client";
|
||||
import MockClient from "../client/mock-client";
|
||||
import RestClient from "../client/rest-client";
|
||||
|
||||
|
||||
interface Config {
|
||||
apiBaseUrl: string;
|
||||
analyticsAccount?: string;
|
||||
recaptcha2Enabled: boolean;
|
||||
recaptcha2SiteKey?: string;
|
||||
clientType: 'mock' | 'rest';
|
||||
}
|
||||
|
||||
class _AppConfig {
|
||||
|
||||
private defaultInstance: Config = {
|
||||
apiBaseUrl: '/',
|
||||
clientType: 'mock',
|
||||
recaptcha2Enabled: true,
|
||||
recaptcha2SiteKey: '6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI'
|
||||
}
|
||||
|
||||
private getInstance(): Config {
|
||||
// Config can be inserted in the html page to define the global properties ...
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
let result = (window as any).serverconfig;
|
||||
if (!result) {
|
||||
result = this.defaultInstance;
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
isRecaptcha2Enabled(): boolean {
|
||||
const config = this.getInstance();
|
||||
return config.recaptcha2Enabled;
|
||||
}
|
||||
|
||||
getRecaptcha2SiteKey(): string | undefined {
|
||||
const config = this.getInstance();
|
||||
return config.recaptcha2SiteKey;
|
||||
}
|
||||
|
||||
getGoogleAnalyticsAccount(): string | undefined {
|
||||
const config = this.getInstance();
|
||||
return config.analyticsAccount;
|
||||
}
|
||||
|
||||
buildClient(): Client {
|
||||
|
||||
const config = this.getInstance();
|
||||
let result: Client;
|
||||
if (config.clientType == 'rest') {
|
||||
result = new RestClient(config.apiBaseUrl, () => {
|
||||
sessionExpired();
|
||||
});
|
||||
console.log('Service using rest client. ' + JSON.stringify(config));
|
||||
} else {
|
||||
console.log('Warning:Service using mockservice client');
|
||||
result = new MockClient();
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
const AppConfig = new _AppConfig();
|
||||
|
||||
export default AppConfig;
|
@ -16,6 +16,7 @@ import GlobalError from '../form/global-error';
|
||||
import SubmitButton from '../form/submit-button';
|
||||
import Typography from '@material-ui/core/Typography';
|
||||
import FormControl from '@material-ui/core/FormControl';
|
||||
import AppConfig from '../../classes/server-config';
|
||||
|
||||
export type Model = {
|
||||
email: string;
|
||||
@ -121,16 +122,17 @@ const RegistrationForm = () => {
|
||||
error={error}
|
||||
/>
|
||||
|
||||
<div style={{ width: '330px', padding: '5px 0px 5px 20px' }}>
|
||||
<ReCAPTCHA
|
||||
sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"
|
||||
onChange={(value: string) => {
|
||||
model.recaptcha = value;
|
||||
setModel(model);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{ AppConfig.isRecaptcha2Enabled() &&
|
||||
<div style={{ width: '330px', padding: '5px 0px 5px 20px' }}>
|
||||
<ReCAPTCHA
|
||||
sitekey={AppConfig.getRecaptcha2SiteKey()}
|
||||
onChange={(value: string) => {
|
||||
model.recaptcha = value;
|
||||
setModel(model);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
<div style={{ fontSize: '12px', padding: '10px 0px' }}>
|
||||
<FormattedMessage
|
||||
id="registration.termandconditions"
|
||||
|
@ -2,37 +2,9 @@
|
||||
import { createSlice } from '@reduxjs/toolkit';
|
||||
import { useQuery } from 'react-query';
|
||||
import Client, { AccountInfo, ErrorInfo, MapInfo } from '../classes/client';
|
||||
import MockClient from '../classes/client/mock-client';
|
||||
import RestClient from '../classes/client/rest-client';
|
||||
import { useSelector } from 'react-redux';
|
||||
import AppConfig from '../classes/server-config';
|
||||
|
||||
interface ConfigInfo {
|
||||
apiBaseUrl: string;
|
||||
}
|
||||
|
||||
class RutimeConfig {
|
||||
private config: ConfigInfo;
|
||||
load() {
|
||||
// Config can be inserted in the html page to define the global properties ...
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
this.config = (window as any).serverconfig;
|
||||
return this;
|
||||
}
|
||||
|
||||
buildClient(): Client {
|
||||
let result: Client;
|
||||
if (this.config) {
|
||||
result = new RestClient(this.config.apiBaseUrl, () => {
|
||||
sessionExpired();
|
||||
});
|
||||
console.log('Service using rest client. ' + JSON.stringify(this.config));
|
||||
} else {
|
||||
console.log('Warning:Service using mockservice client');
|
||||
result = new MockClient();
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
|
||||
export interface ClientStatus {
|
||||
state: 'healthy' | 'session-expired';
|
||||
@ -45,7 +17,7 @@ export interface ClientState {
|
||||
}
|
||||
|
||||
const initialState: ClientState = {
|
||||
instance: new RutimeConfig().load().buildClient(),
|
||||
instance: AppConfig.buildClient(),
|
||||
status: { state: 'healthy' },
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user