Skip to content

Commit eb389b0

Browse files
tynanfordtynanford
authored
Merge pull request #128 from ChannelFinder/central_pref_handling
move all vite env variables to config file
2 parents fd2f33e + 01dfe62 commit eb389b0

File tree

19 files changed

+397
-195
lines changed

19 files changed

+397
-195
lines changed

‎src/api.js‎

Lines changed: 36 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,20 @@
1-
import { ApiProxyConnector } from "@elastic/search-ui-elasticsearch-connector";
21
import { toByteArray } from "base64-js";
3-
import CustomElasticSearchAPIConnector from "./components/caputlog/CustomElasticSearchAPIConnector";
2+
import config from "./config";
43

5-
const channelFinderURL = import.meta.env.PROD ? import.meta.env.REACT_APP_CF_URL : import.meta.env.REACT_APP_CF_URL_DEV;
6-
const cfMaxResults = parseInt(import.meta.env.REACT_APP_CF_MAX_RESULTS);
7-
const ologURL = import.meta.env.PROD ? import.meta.env.REACT_APP_OLOG_URL : import.meta.env.REACT_APP_OLOG_URL_DEV;
8-
const ologWebURL = import.meta.env.PROD ? import.meta.env.REACT_APP_OLOG_WEB_CLIENT_URL : import.meta.env.REACT_APP_OLOG_WEB_CLIENT_URL_DEV;
9-
const aaViewerURL = import.meta.env.PROD ? import.meta.env.REACT_APP_AA_URL : import.meta.env.REACT_APP_AA_URL_DEV;
10-
const pvwsURL = import.meta.env.PROD ? import.meta.env.REACT_APP_PVWS_URL : import.meta.env.REACT_APP_PVWS_URL_DEV;
11-
const pvwsHTTPURL = import.meta.env.PROD ? import.meta.env.REACT_APP_PVWS_HTTP_URL : import.meta.env.REACT_APP_PVWS_HTTP_URL_DEV;
12-
const serverURL = import.meta.env.PROD ? import.meta.env.REACT_APP_BASE_URL : import.meta.env.REACT_APP_BASE_URL_DEV;
13-
const alarmLogURL = import.meta.env.PROD ? import.meta.env.REACT_APP_AL_URL : import.meta.env.REACT_APP_AL_URL_DEV;
14-
const caputlogURL = import.meta.env.PROD ? import.meta.env.REACT_APP_CAPUTLOG_URL : import.meta.env.REACT_APP_CAPUTLOG_URL_DEV;
15-
const ologStartDays = import.meta.env.REACT_APP_OLOG_START_TIME_DAYS !== '' ?
16-
`&start=${import.meta.env.REACT_APP_OLOG_START_TIME_DAYS}days&end=now`
4+
const cfMaxResults = config.CF_MAX_RESULTS;
5+
const ologStartDays = config.OLOG_START_TIME_DAYS !== null
6+
? `&start=${config.OLOG_START_TIME_DAYS}days&end=now`
177
: "";
18-
const ologMaxResults = import.meta.env.REACT_APP_OLOG_MAX_RESULTS !== '' ?
19-
`&size=${import.meta.env.REACT_APP_OLOG_MAX_RESULTS}`
8+
const ologMaxResults = config.OLOG_MAX_RESULTS !== null
9+
? `&size=${config.OLOG_MAX_RESULTS}`
2010
: "";
21-
const alarmLogStartDays = import.meta.env.REACT_APP_AL_START_TIME_DAYS !== '' ?
22-
`&start=${import.meta.env.REACT_APP_AL_START_TIME_DAYS}days&end=now`
11+
const alarmLogStartDays = config.AL_START_TIME_DAYS !== null
12+
? `&start=${config.AL_START_TIME_DAYS}days&end=now`
2313
: "";
24-
const alarmLogMaxResults = import.meta.env.REACT_APP_AL_MAX_RESULTS !== '' ?
25-
`&size=${import.meta.env.REACT_APP_AL_MAX_RESULTS}`
14+
const alarmLogMaxResults = config.AL_MAX_RESULTS !== null
15+
? `&size=${config.AL_MAX_RESULTS}`
2616
: "";
2717

28-
const elasticIndexName = import.meta.env.REACT_APP_ELASTICSEARCH_INDEX_NAME;
29-
const elasticApikey = import.meta.env.REACT_APP_ELASTICSEARCH_API_KEY;
30-
// Choice to use Elasticsearch directly or an API Proxy
31-
const useProxy = import.meta.env.REACT_APP_USE_CAPUT_API_PROXY_CONNNECTOR ?? "false";
32-
const caputLogConnector = (useProxy === "true")
33-
? new ApiProxyConnector({
34-
basePath: `${caputlogURL}`
35-
})
36-
: CustomElasticSearchAPIConnector({
37-
host: `${caputlogURL}`,
38-
index: `${elasticIndexName}`,
39-
apiKey: `${elasticApikey}`
40-
});
41-
4218
function handleParams(params) {
4319
let urlParams = { "pvName": "*", "params": "" };
4420
if ("pvName" in params && params.pvName !== "") {
@@ -64,11 +40,11 @@ function handleParams(params) {
6440

6541
function standardParse(params) {
6642
let noWildcard = new Set(["pvStatus", "recordType"]);
67-
if (import.meta.env.REACT_APP_EXTRA_PROP && import.meta.env.REACT_APP_EXTRA_PROP_DROPDOWN_LABELS) {
68-
noWildcard.add(import.meta.env.REACT_APP_EXTRA_PROP);
43+
if (config.EXTRA_PROP && config.EXTRA_PROP_DROPDOWN_LABELS) {
44+
noWildcard.add(config.EXTRA_PROP);
6945
}
70-
if (import.meta.env.REACT_APP_SECOND_EXTRA_PROP && import.meta.env.REACT_APP_SECOND_EXTRA_PROP_DROPDOWN_LABELS) {
71-
noWildcard.add(import.meta.env.REACT_APP_SECOND_EXTRA_PROP);
46+
if (config.SECOND_EXTRA_PROP && config.SECOND_EXTRA_PROP_DROPDOWN_LABELS) {
47+
noWildcard.add(config.SECOND_EXTRA_PROP);
7248
}
7349

7450
let addOn = "";
@@ -111,11 +87,10 @@ function freeformParse(params) {
11187
async function queryChannelFinder(params) {
11288
let urlParams = handleParams(params);
11389
let maxResults = cfMaxResults ? `&~size=${cfMaxResults}` : "";
114-
let requestURI = `${channelFinderURL}/resources/channels?~name=${urlParams.pvName}${urlParams.params}${maxResults}`;
115-
let options = {};
116-
options = { method: 'GET' }
117-
if (import.meta.env.REACT_APP_SEND_CREDENTIALS === "true") {
118-
if (import.meta.env.PROD) {
90+
let requestURI = `${config.CF_URL}/resources/channels?~name=${urlParams.pvName}${urlParams.params}${maxResults}`;
91+
let options = { method: 'GET' }
92+
if (config.SEND_CREDENTIALS) {
93+
if (config.IS_PROD) {
11994
// credentials header would help if CF, AA, etc are behind a SSO
12095
options['credentials'] = 'include';
12196
}
@@ -130,9 +105,9 @@ async function queryLog(logType, pvName, extraParams) {
130105

131106
let requestURI = ""
132107
if (logType === logEnum.ONLINE_LOG) {
133-
requestURI = encodeURI(`${ologURL}/logs/search?text=${pvName}${ologStartDays}${ologMaxResults}`);
108+
requestURI = encodeURI(`${config.OLOG_URL}/logs/search?text=${pvName}${ologStartDays}${ologMaxResults}`);
134109
} else if (logType === logEnum.ALARM_LOG) {
135-
requestURI = encodeURI(`${alarmLogURL}/search/alarm?pv=${pvName}${alarmLogStartDays}${alarmLogMaxResults}${extraParams}`);
110+
requestURI = encodeURI(`${config.AL_URL}/search/alarm?pv=${pvName}${alarmLogStartDays}${alarmLogMaxResults}${extraParams}`);
136111
} else {
137112
return new Promise((resolve, reject) => {
138113
reject();
@@ -145,9 +120,9 @@ async function getQueryHelpers(helperType) {
145120
let requestURI = ""
146121

147122
if (helperType === queryHelperEnum.PROPERTIES) {
148-
requestURI = `${channelFinderURL}/resources/properties`
123+
requestURI = `${config.CF_URL}/resources/properties`
149124
} else if (helperType === queryHelperEnum.TAGS) {
150-
requestURI = `${channelFinderURL}/resources/tags`
125+
requestURI = `${config.CF_URL}/resources/tags`
151126
} else {
152127
return new Promise((resolve, reject) => {
153128
reject();
@@ -167,34 +142,34 @@ async function getQueryHelpers(helperType) {
167142

168143
async function getCount(params = {}) {
169144
let urlParams = handleParams(params)
170-
let requestURI = `${channelFinderURL}/resources/channels/count?~name=${urlParams.pvName}${urlParams.params}`;
145+
let requestURI = `${config.CF_URL}/resources/channels/count?~name=${urlParams.pvName}${urlParams.params}`;
171146

172147
return await standardQuery(requestURI);
173148
}
174149

175150
async function getCFInfo() {
176-
return await standardQuery(channelFinderURL);
151+
return await standardQuery(config.CF_URL);
177152
}
178153

179154
async function getALInfo() {
180-
const requestURI = alarmLogURL + "/"
155+
const requestURI = config.AL_URL + "/"
181156
return await standardQuery(requestURI);
182157
}
183158

184159
async function getOLOGInfo() {
185-
return await standardQuery(ologURL);
160+
return await standardQuery(config.OLOG_URL);
186161
}
187162

188163
async function getCaputLogInfo() {
189-
return await standardQuery(caputlogURL);
164+
return await standardQuery(config.CAPUTLOG_URL);
190165
}
191166

192167
async function getPVWSInfo(path) {
193-
if (pvwsHTTPURL === "") return;
194-
if (pvwsHTTPURL.slice(-1) !== "/") {
168+
if (config.PVWS_HTTP_URL === "") return;
169+
if (config.PVWS_HTTP_URL.slice(-1) !== "/") {
195170
path = "/" + path;
196171
}
197-
const requestURI = pvwsHTTPURL + path;
172+
const requestURI = config.PVWS_HTTP_URL + path;
198173
return await standardQuery(requestURI);
199174
}
200175

@@ -203,8 +178,8 @@ async function standardQuery(requestURI, options = null, handleData = null) {
203178
let error = "";
204179
let errorFlag = false;
205180

206-
if (import.meta.env.REACT_APP_SEND_CREDENTIALS === "true") {
207-
if (import.meta.env.PROD) {
181+
if (config.SEND_CREDENTIALS) {
182+
if (config.IS_PROD) {
208183
if (options === null) options = {};
209184
// credentials header would help if CF, AA, etc are behind a SSO
210185
options['credentials'] = 'include';
@@ -291,16 +266,16 @@ function parseWebSocketMessage(jsonMessage, fixedPrecision = null) {
291266
pvData.pv_value = Array.prototype.slice.call(value_array);
292267
} else if ("b64byt" in pvData) {
293268
let bytes = toByteArray(pvData.b64byt);
294-
if (import.meta.env.REACT_APP_PVWS_TREAT_BYTE_ARRAY_AS_STRING === "false") {
295-
let value_array = new Uint8Array(bytes.buffer);
296-
pvData.pv_value = Array.prototype.slice.call(value_array);
297-
} else {
269+
if (config.PVWS_TREAT_BYTE_ARRAY_AS_STRING) {
298270
try {
299271
const decoder = new TextDecoder('utf-8');
300272
pvData.pv_value = decoder.decode(bytes);
301273
} catch (error) {
302274
console.log("Error decoding byte array: ", error.message);
303275
}
276+
} else {
277+
let value_array = new Uint8Array(bytes.buffer);
278+
pvData.pv_value = Array.prototype.slice.call(value_array);
304279
}
305280
} else if ("b64flt" in pvData) {
306281
let bytes = toByteArray(pvData.b64flt);
@@ -359,16 +334,8 @@ const api = {
359334
OLI_QUERY: getOLOGInfo,
360335
CAPUTLOG_QUERY: getCaputLogInfo,
361336
PVWSI_QUERY: getPVWSInfo,
362-
CF_URL: channelFinderURL,
363-
OLOG_URL: ologURL,
364-
OLOG_WEB_URL: ologWebURL,
365-
AA_VIEWER: aaViewerURL,
366-
PVWS_URL: pvwsURL,
367-
SERVER_URL: serverURL,
368337
LOG_ENUM: logEnum,
369338
HELPERS_ENUM: queryHelperEnum,
370-
CAPUTLOG_URL: caputlogURL,
371-
CAPUTLOG_CONNECTOR: caputLogConnector,
372339
PARSE_WEBSOCKET_MSG: parseWebSocketMessage,
373340
}
374341

‎src/app/App.jsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import './App.css';
22
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
33
import { Grid, Snackbar, Alert } from '@mui/material';
4-
import React, { useState } from "react";
4+
import { useState } from "react";
55

6+
import config from "../config";
67
import Home from '../components/home';
78
import PV from '../components/pv';
89
import IOC from '../components/ioc';
@@ -39,7 +40,7 @@ function App() {
3940
<Route path="/plot" exact={true} element={<Plot />} />
4041
<Route path="/services" exact={true} element={<Services />} />
4142
{
42-
import.meta.env.REACT_APP_USE_CAPUTLOG === "true" ? <Route path="/caputlog" exact={true} element={<CaputLogPage />} /> : null
43+
config.USE_CAPUTLOG ? <Route path="/caputlog" exact={true} element={<CaputLogPage />} /> : null
4344
}
4445
<Route path="/help" exact={true} element={<Help />} />
4546
<Route path="/" exact={true} element={<Home handleOpenErrorAlert={setOpenErrorAlert} handleErrorMessage={setErrorMessage} handleSeverity={setSeverity} />} />

‎src/colors.js‎

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
1-
const okCol = "#" + import.meta.env.REACT_APP_OK_SEVERITY_COLOR;
2-
const minorCol = "#" + import.meta.env.REACT_APP_MINOR_SEVERITY_COLOR;
3-
const majorCol = "#" + import.meta.env.REACT_APP_MAJOR_SEVERITY_COLOR;
4-
const invalidCol = "#" + import.meta.env.REACT_APP_INVALID_SEVERITY_COLOR;
5-
const undefinedCol = "#" + import.meta.env.REACT_APP_UNDEFINED_SEVERITY_COLOR;
1+
import config from "./config";
62

3+
const handleColor = (value) => {
4+
if (!value) return null;
5+
return value.startsWith("#") ? value : `#${value}`;
6+
};
7+
8+
const okCol = handleColor(config.OK_SEVERITY_COLOR);
9+
const minorCol = handleColor(config.MINOR_SEVERITY_COLOR);
10+
const majorCol = handleColor(config.MAJOR_SEVERITY_COLOR);
11+
const invalidCol = handleColor(config.INVALID_SEVERITY_COLOR);
12+
const undefinedCol = handleColor(config.UNDEFINED_SEVERITY_COLOR);
713

814
// modBrightness function sourced from https://natclark.com/tutorials/javascript-lighten-darken-hex-color/
915
const modBrightness = (hexColor, magnitude) => {
@@ -39,6 +45,6 @@ const severityColors = {
3945

4046
const colors = {
4147
SEV_COLORS: severityColors,
42-
}
48+
};
4349

4450
export default colors;

‎src/components/caputlog/caputlogSearchConfig.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import api from "../../api";
1+
import config from "../../config";
22

33
export function getCaputLogSearchConfig({ filters = [], search_fields = {}, facets = {}, initialState = {} } = {}) {
44
return {
55
alwaysSearchOnInitialLoad: true,
6-
apiConnector: api.CAPUTLOG_CONNECTOR,
6+
apiConnector: config.CAPUTLOG_CONNECTOR,
77
hasA11yNotifications: true,
88
trackUrlState: false,
99
searchQuery: {

‎src/components/header/Header.jsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ import InfoIcon from '@mui/icons-material/Info'
1212
import MenuIcon from '@mui/icons-material/Menu';
1313
import { makeStyles } from 'tss-react/mui';
1414

15+
import config from '../../config';
16+
1517
const useStyles = makeStyles()((theme) => ({
1618
root: {
1719
flexGrow: 1,
@@ -68,7 +70,7 @@ function Header() {
6870
</ListItemIcon>
6971
<ListItemText primary="Plotting" />
7072
</ListItemButton>
71-
{(import.meta.env.REACT_APP_USE_CAPUTLOG || "").toLowerCase() === "true" &&
73+
{config.USE_CAPUTLOG &&
7274
<ListItemButton key="CaputLog" component={NavLink} to="/caputlog" onClick={handleMenuToggle} divider color="primary">
7375
<ListItemIcon>
7476
<InfoIcon color="primary" />
@@ -101,12 +103,12 @@ function Header() {
101103
<NavLink to="/ioc" style={{ textDecoration: "none", color: 'inherit', paddingRight: 40 }}>
102104
<Typography variant="h5">IOCs</Typography>
103105
</NavLink>
104-
{(import.meta.env.REACT_APP_USE_AA || "").toLowerCase() === "true" &&
106+
{config.USE_AA &&
105107
<NavLink to="/plot" style={{ textDecoration: "none", color: 'inherit', paddingRight: 40 }}>
106108
<Typography variant="h5">Plotting</Typography>
107109
</NavLink>
108110
}
109-
{(import.meta.env.REACT_APP_USE_CAPUTLOG || "").toLowerCase() === "true" &&
111+
{config.USE_CAPUTLOG &&
110112
<NavLink to="/caputlog" style={{ textDecoration: "none", color: 'inherit', paddingRight: 40 }}>
111113
<Typography variant="h5">Caput Log</Typography>
112114
</NavLink>

‎src/components/help/Help.jsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { Fragment } from "react";
22
import { Typography, Grid, Link } from "@mui/material";
33
import { Link as RouterLink } from "react-router-dom";
44
import archivePlotOptions from "../../assets/archive-options.png";
5-
5+
import config from "../../config";
66

77
function Help() {
88

@@ -18,7 +18,7 @@ function Help() {
1818
<Typography variant='body1' paragraph={true}>
1919
Process Variable (PV) is the name applied to the Real-Time Database Records that contain control system information.
2020
Like most Database records it has a set of fields. Unlike conventional database records, Process Variables are 'connected' to the 'real world',
21-
so they reflect or control values in the control system. For example, here is a PV at our facility: <Link component={RouterLink} to={"/pv/" + import.meta.env.REACT_APP_HELP_EXAMPLE_PV} underline="always">{import.meta.env.REACT_APP_HELP_EXAMPLE_PV}</Link>
21+
so they reflect or control values in the control system. For example, here is a PV at our facility: <Link component={RouterLink} to={"/pv/" + config.HELP_EXAMPLE_PV} underline="always">{config.HELP_EXAMPLE_PV}</Link>
2222
</Typography>
2323
<Typography variant='body1' paragraph={true}>
2424
The Control System is based on the Experimental Physics and Industrial Control System
@@ -88,7 +88,7 @@ function Help() {
8888

8989
<li>
9090
Current status of this PV. Either Active or Inactive. Inactive means the PV is not synchronized with the recsync server and indicates a problem with the IOC or recsync.
91-
{ import.meta.env.REACT_APP_PVWS_IGNORE_CF_PVSTATUS !== "true" &&
91+
{ !config.PVWS_IGNORE_CF_PVSTATUS &&
9292
<li>If the PV is inactive then the PV value monitor checkbox will be disabled.</li>
9393
}
9494
</li>
@@ -105,22 +105,22 @@ function Help() {
105105
PVs can have alias names. You can click on the alias name to open the details page for the alias (will have the same information as the real PV name).
106106
</li>
107107
</ul>
108-
{import.meta.env.REACT_APP_EXTRA_PROP.length > 0 &&
108+
{config.EXTRA_PROP && config.EXTRA_PROP.length > 0 &&
109109
<div>
110-
<li><strong>{import.meta.env.REACT_APP_EXTRA_PROP_LABEL}</strong></li>
110+
<li><strong>{config.EXTRA_PROP_LABEL}</strong></li>
111111
<ul>
112112
<li>
113-
{import.meta.env.REACT_APP_EXTRA_PROP_HELP_TEXT}
113+
{config.EXTRA_PROP_HELP_TEXT}
114114
</li>
115115
</ul>
116116
</div>
117117
}
118-
{import.meta.env.REACT_APP_SECOND_EXTRA_PROP.length > 0 &&
118+
{config.SECOND_EXTRA_PROP && config.SECOND_EXTRA_PROP.length > 0 &&
119119
<div>
120-
<li><strong>{import.meta.env.REACT_APP_SECOND_EXTRA_PROP_LABEL}</strong></li>
120+
<li><strong>{config.SECOND_EXTRA_PROP_LABEL}</strong></li>
121121
<ul>
122122
<li>
123-
{import.meta.env.REACT_APP_SECOND_EXTRA_PROP_HELP_TEXT}
123+
{config.SECOND_EXTRA_PROP_HELP_TEXT}
124124
</li>
125125
</ul>
126126
</div>

0 commit comments

Comments
 (0)