Skip to content

Commit 15b585d

Browse files
committed
2321: Started work on linting admin
1 parent 899540e commit 15b585d

31 files changed

+357
-236
lines changed

.eslintrc

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,11 @@
77
"plugin:prettier/recommended"
88
],
99
"ignorePatterns": ["*.yml"],
10+
"globals": {
11+
"window": true,
12+
"localStorage": true,
13+
"document": true
14+
},
1015
"parser": "babel-eslint",
1116
"parserOptions": {
1217
"sourceType": "module",

src/components/feed-sources/feed-source-form.jsx

Lines changed: 33 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ import FormSelect from "../util/forms/select";
1010
import ContentBody from "../util/content-body/content-body";
1111
import ContentFooter from "../util/content-footer/content-footer";
1212
import FormInput from "../util/forms/form-input";
13-
import CalendarApiFeedType from "./templates/calendar-api-feed-type.jsx";
14-
import NotifiedFeedType from "./templates/notified-feed-type.jsx";
15-
import EventDatabaseApiFeedType from "./templates/event-database-feed-type.jsx";
13+
import CalendarApiFeedType from "./templates/calendar-api-feed-type";
14+
import NotifiedFeedType from "./templates/notified-feed-type";
15+
import EventDatabaseApiFeedType from "./templates/event-database-feed-type";
1616

1717
/**
1818
* The feed-source form component.
@@ -22,13 +22,14 @@ import EventDatabaseApiFeedType from "./templates/event-database-feed-type.jsx";
2222
* @param {Function} props.handleInput Handles form input.
2323
* @param {Function} props.handleSubmit Handles form submit.
2424
* @param {string} props.headerText Headline text.
25-
* @param {boolean} [props.isLoading=false] Indicator of whether the form is
26-
* loading. Default is `false`
27-
* @param {string} [props.loadingMessage=""] The loading message for the
28-
* spinner. Default is `""`
29-
* @param {object} props.feedSource The feed source object
25+
* @param {boolean} [props.isLoading] Indicator of whether the form is loading.
26+
* Default is `false`
27+
* @param {string} [props.loadingMessage] The loading message for the spinner.
28+
* Default is `""`
3029
* @param {object} props.feedSourceTypeOptions The options for feed source types
3130
* @param {string} props.mode The mode
31+
* @param {Function} props.onFeedTypeChange Callback on feed type change.
32+
* @param {Function} props.handleSecretInput Callback on secret input change.
3233
* @returns {object} The feed-source form.
3334
*/
3435
function FeedSourceForm({
@@ -81,15 +82,28 @@ function FeedSourceForm({
8182
options={feedSourceTypeOptions}
8283
/>
8384

84-
{feedSource?.feedType === "App\\Feed\\CalendarApiFeedType" &&
85-
(<CalendarApiFeedType handleInput={handleSecretInput} formStateObject={feedSource.secrets} mode={mode} feedSourceId={feedSource['@id']} />)
86-
}
87-
{feedSource?.feedType === "App\\Feed\\EventDatabaseApiFeedType" &&
88-
(<EventDatabaseApiFeedType handleInput={handleSecretInput} formStateObject={feedSource.secrets} mode={mode} />)
89-
}
90-
{feedSource?.feedType === "App\\Feed\\NotifiedFeedType" &&
91-
(<NotifiedFeedType handleInput={handleSecretInput} formStateObject={feedSource.secrets} mode={mode} />)
92-
}
85+
{feedSource?.feedType === "App\\Feed\\CalendarApiFeedType" && (
86+
<CalendarApiFeedType
87+
handleInput={handleSecretInput}
88+
formStateObject={feedSource.secrets}
89+
mode={mode}
90+
feedSourceId={feedSource["@id"]}
91+
/>
92+
)}
93+
{feedSource?.feedType === "App\\Feed\\EventDatabaseApiFeedType" && (
94+
<EventDatabaseApiFeedType
95+
handleInput={handleSecretInput}
96+
formStateObject={feedSource.secrets}
97+
mode={mode}
98+
/>
99+
)}
100+
{feedSource?.feedType === "App\\Feed\\NotifiedFeedType" && (
101+
<NotifiedFeedType
102+
handleInput={handleSecretInput}
103+
formStateObject={feedSource.secrets}
104+
mode={mode}
105+
/>
106+
)}
93107
</ContentBody>
94108
<ContentFooter>
95109
<Button
@@ -126,13 +140,11 @@ FeedSourceForm.propTypes = {
126140
}),
127141
handleInput: PropTypes.func.isRequired,
128142
handleSubmit: PropTypes.func.isRequired,
143+
handleSecretInput: PropTypes.func.isRequired,
144+
onFeedTypeChange: PropTypes.func.isRequired,
129145
headerText: PropTypes.string.isRequired,
130146
isLoading: PropTypes.bool,
131147
loadingMessage: PropTypes.string,
132-
dynamicFormElement: PropTypes.oneOfType([
133-
PropTypes.element,
134-
PropTypes.arrayOf(PropTypes.element),
135-
]),
136148
feedSourceTypeOptions: PropTypes.arrayOf(
137149
PropTypes.shape({
138150
value: PropTypes.string.isRequired,

src/components/feed-sources/feed-source-manager.jsx

Lines changed: 11 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { cloneElement, React, useEffect, useState } from "react";
1+
import { React, useEffect, useState } from "react";
22
import { useTranslation } from "react-i18next";
33
import PropTypes from "prop-types";
44
import { useNavigate } from "react-router-dom";
@@ -11,9 +11,6 @@ import {
1111
displayError,
1212
displaySuccess,
1313
} from "../util/list/toast-component/display-toast";
14-
import EventDatabaseFeedType from "./templates/event-database-feed-type.jsx";
15-
import NotifiedFeedType from "./templates/notified-feed-type.jsx";
16-
import CalendarApiFeedType from "./templates/calendar-api-feed-type.jsx";
1714

1815
/**
1916
* The theme manager component.
@@ -48,7 +45,6 @@ function FeedSourceManager({
4845
t("loading-messages.loading-feed-source")
4946
);
5047

51-
const [dynamicFormElement, setDynamicFormElement] = useState();
5248
const [submitting, setSubmitting] = useState(false);
5349
const [formStateObject, setFormStateObject] = useState({});
5450

@@ -68,23 +64,23 @@ function FeedSourceManager({
6864
title: t("dynamic-fields.event-database-api-feed-type.title"),
6965
key: "1",
7066
secretsDefault: {
71-
"host": ""
67+
host: "",
7268
},
7369
},
7470
{
7571
value: "App\\Feed\\NotifiedFeedType",
7672
title: t("dynamic-fields.notified-feed-type.title"),
7773
key: "2",
7874
secretsDefault: {
79-
"token": "",
75+
token: "",
8076
},
8177
},
8278
{
8379
value: "App\\Feed\\CalendarApiFeedType",
8480
title: t("dynamic-fields.calendar-api-feed-type.title"),
8581
key: "0",
8682
secretsDefault: {
87-
"locations": []
83+
locations: [],
8884
},
8985
},
9086
{
@@ -118,20 +114,20 @@ function FeedSourceManager({
118114
setFormStateObject(newState);
119115
}, [initialState]);
120116

121-
const handleSecretInput = ({target}) => {
117+
const handleSecretInput = ({ target }) => {
122118
const secrets = { ...formStateObject.secrets };
123119
secrets[target.id] = target.value;
124-
setFormStateObject({ ...formStateObject, secrets: secrets });
120+
setFormStateObject({ ...formStateObject, secrets });
125121
};
126122

127-
const onFeedTypeChange = ({target}) => {
128-
const value = target.value
123+
const onFeedTypeChange = ({ target }) => {
124+
const { value } = target;
129125
const option = feedSourceTypeOptions.find((opt) => opt.value === value);
130-
const newFormStateObject = {...formStateObject};
126+
const newFormStateObject = { ...formStateObject };
131127
newFormStateObject.feedType = value;
132-
newFormStateObject.secrets = {...option.secretsDefault};
128+
newFormStateObject.secrets = { ...option.secretsDefault };
133129
setFormStateObject(newFormStateObject);
134-
}
130+
};
135131

136132
/** Save feed source. */
137133
function saveFeedSource() {
@@ -196,7 +192,6 @@ function FeedSourceManager({
196192
onFeedTypeChange={onFeedTypeChange}
197193
handleSecretInput={handleSecretInput}
198194
feedSourceTypeOptions={feedSourceTypeOptions}
199-
dynamicFormElement={dynamicFormElement}
200195
mode={saveMethod}
201196
/>
202197
)}
@@ -225,7 +220,6 @@ FeedSourceManager.propTypes = {
225220
status: PropTypes.number,
226221
}),
227222
}),
228-
mode: PropTypes.string,
229223
};
230224

231225
export default FeedSourceManager;

src/components/feed-sources/feed-sources-columns.jsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import { React, useContext } from "react";
22
import { useTranslation } from "react-i18next";
33
import ColumnHoc from "../util/column-hoc";
4-
import ListButton from "../util/list/list-button.jsx";
5-
import SelectColumnHoc from "../util/select-column-hoc.jsx";
6-
import UserContext from "../../context/user-context.jsx";
4+
import ListButton from "../util/list/list-button";
5+
import SelectColumnHoc from "../util/select-column-hoc";
6+
import UserContext from "../../context/user-context";
77

88
/**
99
* Retrieves the columns for feed sources data based on API call response.
@@ -12,7 +12,6 @@ import UserContext from "../../context/user-context.jsx";
1212
* @param {Function} props.apiCall - The API call function to retrieve feed sources data.
1313
* @param {string} props.infoModalRedirect - The redirect URL for information modal.
1414
* @param {string} props.infoModalTitle - The title for information modal.
15-
* @param {string} props.dataKey - The key for data retrieval.
1615
* @returns {object} Columns - An array of objects representing the columns for
1716
* feed sources data.
1817
*/

src/components/feed-sources/feed-sources-list.jsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,17 @@ import {
66
useDeleteV2FeedSourcesByIdMutation,
77
useGetV2FeedSourcesByIdSlidesQuery,
88
} from "../../redux/api/api.generated.ts";
9-
import ListContext from "../../context/list-context.jsx";
10-
import ContentBody from "../util/content-body/content-body.jsx";
11-
import List from "../util/list/list.jsx";
9+
import ListContext from "../../context/list-context";
10+
import ContentBody from "../util/content-body/content-body";
11+
import List from "../util/list/list";
1212
import { FeedSourceColumns } from "./feed-sources-columns";
1313
import {
1414
displayError,
1515
displaySuccess,
16-
} from "../util/list/toast-component/display-toast.jsx";
17-
import idFromUrl from "../util/helpers/id-from-url.jsx";
18-
import UserContext from "../../context/user-context.jsx";
19-
import useModal from "../../context/modal-context/modal-context-hook.jsx";
16+
} from "../util/list/toast-component/display-toast";
17+
import idFromUrl from "../util/helpers/id-from-url";
18+
import UserContext from "../../context/user-context";
19+
import useModal from "../../context/modal-context/modal-context-hook";
2020

2121
/**
2222
* The feed sources list component.
Lines changed: 30 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,55 @@
1-
import { React } from "react";
1+
import { React, useEffect, useState } from "react";
22
import PropTypes from "prop-types";
33
import { useTranslation } from "react-i18next";
4-
import MultiselectFromEndpoint from "../../slide/content/multiselect-from-endpoint.jsx";
54
import { Alert } from "react-bootstrap";
5+
import MultiselectFromEndpoint from "../../slide/content/multiselect-from-endpoint";
6+
import ConfigLoader from "../../../config-loader";
67

7-
const CalendarApiFeedType = ({ feedSourceId, handleInput, formStateObject }) => {
8+
const CalendarApiFeedType = ({
9+
feedSourceId,
10+
handleInput,
11+
formStateObject,
12+
}) => {
813
const { t } = useTranslation("common", {
9-
keyPrefix: "feed-source-manager.dynamic-fields.calendar-api-feed-type"
14+
keyPrefix: "feed-source-manager.dynamic-fields.calendar-api-feed-type",
1015
});
1116

17+
const [optionsEndpoint, setOptionsEndpoint] = useState(null);
18+
19+
useEffect(() => {
20+
if (feedSourceId && feedSourceId !== "") {
21+
ConfigLoader.loadConfig().then((config) => {
22+
setOptionsEndpoint(`${config.api + feedSourceId}/config/locations`);
23+
});
24+
}
25+
}, [feedSourceId]);
26+
1227
return (
1328
<>
14-
{!feedSourceId && (<Alert className="mt-4" variant="warning">
15-
{t("save-before-locations-can-be-set")}
16-
</Alert>)}
17-
{feedSourceId &&
29+
{!feedSourceId && (
30+
<Alert className="mt-4" variant="warning">
31+
{t("save-before-locations-can-be-set")}
32+
</Alert>
33+
)}
34+
{optionsEndpoint && (
1835
<MultiselectFromEndpoint
1936
onChange={handleInput}
20-
name={"locations"}
37+
name="locations"
2138
label={t("locations")}
2239
value={formStateObject.locations ?? []}
23-
optionsEndpoint={"https://displayapiservice.local.itkdev.dk" + feedSourceId + "/config/locations"}
40+
optionsEndpoint={optionsEndpoint}
2441
/>
25-
}
42+
)}
2643
</>
2744
);
2845
};
2946

3047
CalendarApiFeedType.propTypes = {
3148
handleInput: PropTypes.func,
3249
formStateObject: PropTypes.shape({
33-
locations: PropTypes.arrayOf(PropTypes.string)
50+
locations: PropTypes.arrayOf(PropTypes.string),
3451
}),
35-
mode: PropTypes.string
52+
feedSourceId: PropTypes.string,
3653
};
3754

3855
export default CalendarApiFeedType;

src/components/feed-sources/templates/event-database-feed-type.jsx

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
import { React } from "react";
22
import PropTypes from "prop-types";
3-
import FormInput from "../../util/forms/form-input";
43
import { useTranslation } from "react-i18next";
4+
import FormInput from "../../util/forms/form-input";
55

6-
const EventDatabaseApiTemplate = ({
7-
handleInput,
8-
formStateObject,
9-
mode,
10-
}) => {
11-
const { t } = useTranslation("common", { keyPrefix: "feed-source-manager.dynamic-fields.event-database-api-feed-type" });
6+
const EventDatabaseApiTemplate = ({ handleInput, formStateObject, mode }) => {
7+
const { t } = useTranslation("common", {
8+
keyPrefix:
9+
"feed-source-manager.dynamic-fields.event-database-api-feed-type",
10+
});
1211
return (
1312
<>
1413
<FormInput
@@ -17,9 +16,7 @@ const EventDatabaseApiTemplate = ({
1716
label={t("host")}
1817
onChange={handleInput}
1918
placeholder={
20-
mode === "PUT"
21-
? t("redacted-value-input-placeholder")
22-
: ""
19+
mode === "PUT" ? t("redacted-value-input-placeholder") : ""
2320
}
2421
value={formStateObject?.host}
2522
/>
@@ -30,9 +27,7 @@ const EventDatabaseApiTemplate = ({
3027
EventDatabaseApiTemplate.propTypes = {
3128
handleInput: PropTypes.func,
3229
formStateObject: PropTypes.shape({
33-
secrets: PropTypes.shape({
34-
host: PropTypes.string,
35-
}),
30+
host: PropTypes.string,
3631
}),
3732
mode: PropTypes.string,
3833
};

src/components/feed-sources/templates/notified-feed-type.jsx

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,7 @@ import PropTypes from "prop-types";
33
import { useTranslation } from "react-i18next";
44
import FormInput from "../../util/forms/form-input";
55

6-
const NotifiedFeedType = ({
7-
handleInput,
8-
formStateObject,
9-
mode,
10-
}) => {
6+
const NotifiedFeedType = ({ handleInput, formStateObject, mode }) => {
117
const { t } = useTranslation("common", {
128
keyPrefix: "feed-source-manager.dynamic-fields.notified-feed-type",
139
});
@@ -20,9 +16,7 @@ const NotifiedFeedType = ({
2016
label={t("token")}
2117
onChange={handleInput}
2218
placeholder={
23-
mode === "PUT"
24-
? t("redacted-value-input-placeholder")
25-
: ""
19+
mode === "PUT" ? t("redacted-value-input-placeholder") : ""
2620
}
2721
value={formStateObject.token}
2822
/>

src/components/playlist-drag-and-drop/playlist-drag-and-drop.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,8 +58,8 @@ function PlaylistDragAndDrop({
5858
});
5959

6060
/**
61-
* @param regionsAndPlaylists This method initializes playlists, so the
62-
* initial formstate object in screen manager is not empty
61+
* @param {object} regionsAndPlaylists This method initializes playlists, so
62+
* the initial formstate object in screen manager is not empty
6363
*/
6464
function callbackToinitializePlaylists(regionsAndPlaylists) {
6565
handleChange({

src/components/playlist/playlist-campaign-form.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ function PlaylistCampaignForm({
8282
type="text"
8383
label={t("playlist-campaign-form.playlist-description-label")}
8484
placeholder={t(
85-
"playlist-campaign-form.playlist-description-placeholder",
85+
"playlist-campaign-form.playlist-description-placeholder"
8686
)}
8787
value={playlist.description}
8888
onChange={handleInput}

0 commit comments

Comments
 (0)