loaded config from server

client/src/components/Root.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { AuthProvider } from 'oidc-react';
 import { Provider } from 'react-redux';
@@ -17,19 +17,12 @@ import '../lib/custom-ui/styles.css';
 import '../styles.module.scss';
 import OidcLoginContainer from '../containers/OidcLoginContainer';
 
-const oidcConfig = {
-  authority: 'https://auth.jjakt.monster/realms/test-realm/',
-  clientId: 'planka-dev',
-  redirectUri: 'http://localhost:3000/OidcLogin',
-};
-
-function Root({ store, history }) {
+function Root({ store, history, config }) {
   return (
     <AuthProvider
-      onSignIn={oidcConfig.onSignIn}
-      authority={oidcConfig.authority}
-      clientId={oidcConfig.clientId}
-      redirectUri={oidcConfig.redirectUri}
+      authority={config.authority}
+      clientId={config.clientId}
+      redirectUri={config.redirectUri}
     >
       <Provider store={store}>
         <ReduxRouter history={history}>
@@ -47,11 +40,11 @@ function Root({ store, history }) {
     </AuthProvider>
   );
 }
-
 Root.propTypes = {
   /* eslint-disable react/forbid-prop-types */
   store: PropTypes.object.isRequired,
   history: PropTypes.object.isRequired,
+  config: PropTypes.object.isRequired,
   /* eslint-enable react/forbid-prop-types */
 };
 

client/src/index.js

@@ -4,8 +4,12 @@ import ReactDOM from 'react-dom/client';
 import store from './store';
 import history from './history';
 import Root from './components/Root';
-
+// import appConfig from './api/appconfig';
 import './i18n';
 
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(React.createElement(Root, { store, history }));
+fetch('http://localhost:1337/api/appconfig').then((response) => {
+  response.json().then((config) => {
+    const root = ReactDOM.createRoot(document.getElementById('root'));
+    root.render(React.createElement(Root, { store, history, config }));
+  });
+});

server/api/controllers/appconfig/index.js

@@ -0,0 +1,10 @@
+module.exports = {
+  async fn() {
+    const config = {
+      authority: sails.config.custom.oidcIssuer,
+      clientId: sails.config.custom.oidcClientId,
+      redirectUri: sails.config.custom.oidcredirectUri,
+    };
+    return config;
+  },
+};

server/config/custom.js

@@ -33,6 +33,8 @@ module.exports.custom = {
 
   oidcIssuer: process.env.OIDC_ISSUER,
   oidcAudience: process.env.OIDC_AUDIENCE,
+  oidcClientId: process.env.OIDC_CLIENT_ID,
   oidcRolesAttribute: process.env.OIDC_ROLES_ATTRIBUTE || 'groups',
   oidcAdminRoles: process.env.OIDC_ADMIN_ROLES.split(',') || [],
+  oidcredirectUri: process.env.OIDC_REDIRECT_URI,
 };

server/config/policies.js

@@ -25,4 +25,5 @@ module.exports.policies = {
 
   'access-tokens/create': true,
   'access-tokens/exchange': true,
+  'appconfig/index': true,
 };

server/config/routes.js

@@ -9,6 +9,8 @@
  */
 
 module.exports.routes = {
+  'GET /api/appconfig': 'appconfig/index',
+
   'POST /api/access-tokens': 'access-tokens/create',
   'POST /api/access-tokens/exchange': 'access-tokens/exchange',
   'DELETE /api/access-tokens/me': 'access-tokens/delete',