Skip to content

Commit 99c7c53

Browse files
gregorydlogangregorydlogan
committed
Merge branch 'r/19.x' into develop
2 parents 0f2b8f2 + fa26e41 commit 99c7c53

15 files changed

Lines changed: 201 additions & 106 deletions

File tree

‎src/components/configuration/partials/wizard/BumperPage.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,7 @@ const BumperPage = <T extends RequiredFormProps>({
9393
acceptableTypes="video/*"
9494
fileId={!isTrailer ? "bumperFile" : "trailerFile"}
9595
fileName={!isTrailer ? "bumperFileName" : "trailerFileName"}
96+
fileUrlKey={!isTrailer ? "bumperFileUrl" : "trailerFileUrl"}
9697
formik={formik}
9798
buttonKey="CONFIGURATION.THEMES.DETAILS.BUMPER.UPLOAD_BUTTON"
9899
labelKey="CONFIGURATION.THEMES.DETAILS.BUMPER.UPLOAD_LABEL"

‎src/components/configuration/partials/wizard/TitleSlidePage.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,7 @@ const TitleSlidePage = <T extends RequiredFormProps>({
9898
acceptableTypes="image/*"
9999
fileId="titleSlideBackground"
100100
fileName="titleSlideBackgroundName"
101+
fileUrlKey="titleSlideBackgroundUrl"
101102
formik={formik}
102103
labelKey="CONFIGURATION.THEMES.DETAILS.TITLE.UPLOAD_LABEL"
103104
buttonKey="CONFIGURATION.THEMES.DETAILS.TITLE.UPLOAD_BUTTON"

‎src/components/configuration/partials/wizard/WatermarkPage.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,9 +75,10 @@ const WatermarkPage = <T extends RequiredFormProps>({
7575
</header>
7676
<div className="obj-container padded">
7777
<FileUpload
78-
acceptableTypes="image/*"
78+
acceptableTypes="image/gif,image/png,image/jpg,image/jpeg,image/bmp"
7979
fileId="watermarkFile"
8080
fileName="watermarkFileName"
81+
fileUrlKey="watermarkFileUrl"
8182
formik={formik}
8283
buttonKey="CONFIGURATION.THEMES.DETAILS.WATERMARK.UPLOAD_BUTTON"
8384
labelKey="CONFIGURATION.THEMES.DETAILS.WATERMARK.UPLOAD_LABEL"

‎src/components/events/partials/ModalTabsAndPages/NewAccessPage.tsx‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,12 @@ import ModalContentTable from "../../../shared/modals/ModalContentTable";
2424
* This component renders the access page for new events and series in the wizards.
2525
*/
2626
interface RequiredFormProps {
27-
"dublincore/episode_isPartOf": string,
28-
policies: TransformedAcl[],
29-
aclTemplate: string,
30-
// theme: string,
27+
metadata: {
28+
"dublincore/episode_isPartOf": string,
29+
},
30+
policies: TransformedAcl[],
31+
aclTemplate: string,
32+
// theme: string,
3133
}
3234

3335
const NewAccessPage = <T extends RequiredFormProps>({
@@ -76,15 +78,15 @@ const NewAccessPage = <T extends RequiredFormProps>({
7678

7779
// If we have to use series ACL, fetch it
7880
useEffect(() => {
79-
if (initEventAclWithSeriesAcl && formik.values["dublincore/episode_isPartOf"]) {
80-
dispatch(fetchSeriesDetailsAcls(formik.values["dublincore/episode_isPartOf"]));
81+
if (initEventAclWithSeriesAcl && formik.values.metadata["dublincore/episode_isPartOf"]) {
82+
dispatch(fetchSeriesDetailsAcls(formik.values.metadata["dublincore/episode_isPartOf"]));
8183
}
8284
// eslint-disable-next-line react-hooks/exhaustive-deps
83-
}, [formik.values["dublincore/episode_isPartOf"], initEventAclWithSeriesAcl, dispatch]);
85+
}, [formik.values.metadata["dublincore/episode_isPartOf"], initEventAclWithSeriesAcl, dispatch]);
8486

8587
// If we have to use series ACL, overwrite existing rules
8688
useEffect(() => {
87-
if (initEventAclWithSeriesAcl && formik.values["dublincore/episode_isPartOf"] && seriesAcl) {
89+
if (initEventAclWithSeriesAcl && formik.values.metadata["dublincore/episode_isPartOf"] && seriesAcl) {
8890
formik.setFieldValue("policies", seriesAcl);
8991
}
9092
// eslint-disable-next-line react-hooks/exhaustive-deps

‎src/components/events/partials/ModalTabsAndPages/NewSourcePage.tsx‎

Lines changed: 27 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -277,18 +277,39 @@ const Upload = <T extends RequiredFormPropsUpload>({
277277
</p>
278278
</td>
279279
<td>
280-
<div className="file-upload">
280+
<div
281+
className="fake-file-input blue-btn"
282+
role="button"
283+
tabIndex={0}
284+
onClick={() => document.getElementById(asset.id)?.click()}
285+
onKeyDown={e => {
286+
if (e.key === "Enter" || e.key === " ") {
287+
e.preventDefault();
288+
document.getElementById(asset.id)?.click();
289+
}
290+
}}
291+
aria-label={t("EVENTS.EVENTS.NEW.SOURCE.UPLOAD.ARIA_FILE_PICKER")}
292+
>
293+
<span className="file-button">
294+
{t("EVENTS.EVENTS.NEW.SOURCE.UPLOAD.FILE_PICKER")}
295+
</span>
296+
297+
<span className="file-text">
298+
{asset.file && asset.file.length > 0
299+
? asset.file[0].name
300+
: t("EVENTS.EVENTS.NEW.SOURCE.UPLOAD.NO_FILE_PICKED")}
301+
</span>
302+
281303
<input
282304
id={asset.id}
283-
className="blue-btn file-select-btn"
305+
type="file"
306+
name={`uploadAssetsTrack.${key}.file`}
307+
hidden
284308
accept={asset.accept}
309+
multiple={asset.multiple}
285310
onChange={e =>
286311
handleChange(e, `uploadAssetsTrack.${key}.file`)
287312
}
288-
type="file"
289-
multiple={asset.multiple}
290-
name={`uploadAssetsTrack.${key}.file`}
291-
tabIndex={0}
292313
/>
293314
</div>
294315
</td>

‎src/components/shared/TableFilters.tsx‎

Lines changed: 53 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,12 @@ import { useTranslation } from "react-i18next";
33
import DatePicker from "react-datepicker";
44
import {
55
getFilters,
6-
getSecondFilter,
7-
getSelectedFilter,
86
getTextFilter,
97
} from "../../selectors/tableFilterSelectors";
108
import {
119
FilterData,
1210
editFilterValue,
13-
editSelectedFilter,
1411
editTextFilter,
15-
removeSecondFilter,
16-
removeSelectedFilter,
1712
removeTextFilter,
1813
resetFilterValues,
1914
} from "../../slices/tableFilterSlice";
@@ -52,8 +47,8 @@ const TableFilters = ({
5247
const dispatch = useAppDispatch();
5348

5449
const filterMap = useAppSelector(state => getFilters(state, resource));
55-
const secondFilter = useAppSelector(state => getSecondFilter(state));
56-
const selectedFilter = useAppSelector(state => getSelectedFilter(state));
50+
const [selectedFilter, setSelectedFilter] = useState("");
51+
const [secondFilter, setSecondFilter] = useState("");
5752
const textFilter = useAppSelector(state => getTextFilter(state, resource));
5853

5954
// Variables for showing different dialogs depending on what was clicked
@@ -76,8 +71,7 @@ const TableFilters = ({
7671
setFilterSelector(false);
7772

7873
dispatch(removeTextFilter(resource));
79-
dispatch(removeSelectedFilter());
80-
dispatch(removeSelectedFilter());
74+
setSelectedFilter("");
8175

8276
// Set all values of the filters in filterMap back to ""
8377
dispatch(resetFilterValues());
@@ -119,7 +113,7 @@ const TableFilters = ({
119113
}
120114

121115
if (name === "selectedFilter") {
122-
dispatch(editSelectedFilter(value));
116+
setSelectedFilter(value);
123117
setOpenSecondFilterMenu(true);
124118
}
125119

@@ -130,8 +124,8 @@ const TableFilters = ({
130124
if (filter) {
131125
dispatch(editFilterValue({ filterName: filter.name, value: value, resource }));
132126
setFilterSelector(false);
133-
dispatch(removeSelectedFilter());
134-
dispatch(removeSecondFilter());
127+
setSelectedFilter("");
128+
setSecondFilter("");
135129
setOpenSecondFilterMenu(false);
136130
mustApplyChanges = true;
137131
}
@@ -211,7 +205,7 @@ const TableFilters = ({
211205
resource,
212206
}));
213207
setFilterSelector(false);
214-
dispatch(removeSelectedFilter());
208+
setSelectedFilter("");
215209
// Reload of resource after going to very first page.
216210
dispatch(goToPage(0));
217211
await dispatch(loadResource());
@@ -493,6 +487,52 @@ const FilterSwitch = ({
493487
/>
494488
</div>
495489
);
490+
case "freetext":
491+
return (
492+
<div>
493+
<DropDown
494+
creatable={true}
495+
value={secondFilter}
496+
text={secondFilter}
497+
options={
498+
!!filter.options && filter.options.length > 0
499+
? filter.options.map(option => {
500+
if (!filter.translatable) {
501+
return {
502+
...option,
503+
label: option.label.substr(0, 40),
504+
};
505+
} else {
506+
return {
507+
...option,
508+
label: t(option.label as ParseKeys).substr(0, 40),
509+
};
510+
}
511+
})
512+
: []
513+
}
514+
required={true}
515+
handleChange={element => handleChange("secondFilter", element!.value)}
516+
placeholder={
517+
!!filter.options && filter.options.length > 0
518+
? t(
519+
"TABLE_FILTERS.FILTER_VALUE_SELECTION.PLACEHOLDER",
520+
)
521+
: t(
522+
"TABLE_FILTERS.FILTER_SELECTION.NO_OPTIONS",
523+
)
524+
}
525+
autoFocus
526+
defaultOpen
527+
openMenuOnFocus
528+
menuIsOpen={openSecondFilterMenu}
529+
handleMenuIsOpen={setOpenSecondFilterMenu}
530+
skipTranslate={!filter.translatable}
531+
customCSS={{ width: 200, optionPaddingTop: 5 }}
532+
/>
533+
{/* For text filter, there is no secondary filter, so nothing is shown here */}
534+
</div>
535+
);
496536
// This should never happen
497537
default:
498538
return null;

‎src/components/shared/modals/ResourceDetailsAccessPolicyTab.tsx‎

Lines changed: 7 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -547,11 +547,11 @@ export const AccessPolicyTable = <T extends AccessPolicyTabFormikProps>({
547547
handleChange={element => {
548548
if (element) {
549549
const matchingRole = roles.find(role => role.name === element.value);
550-
arrayHelpers.replace(formik.values.policies.findIndex(p => p === policy), {
551-
...policy,
552-
role: element.value,
553-
user: matchingRole ? matchingRole.user : undefined,
554-
});
550+
formik.setFieldValue(`policies.${index}.role`, element.value);
551+
formik.setFieldValue(
552+
`policies.${index}.user`,
553+
matchingRole ? matchingRole.user : undefined,
554+
);
555555
}
556556
}}
557557
placeholder={
@@ -591,10 +591,7 @@ export const AccessPolicyTable = <T extends AccessPolicyTabFormikProps>({
591591
: "false"
592592
}`}
593593
onChange={(read: React.ChangeEvent<HTMLInputElement>) =>
594-
arrayHelpers.replace(formik.values.policies.findIndex(p => p === policy), {
595-
...policy,
596-
read: read.target.checked,
597-
})
594+
formik.setFieldValue(`policies.${index}.read`, read.target.checked)
598595
}
599596
/>
600597
</td>
@@ -618,11 +615,7 @@ export const AccessPolicyTable = <T extends AccessPolicyTabFormikProps>({
618615
: "false"
619616
}`}
620617
onChange={(write: React.ChangeEvent<HTMLInputElement>) =>
621-
arrayHelpers.replace(formik.values.policies.findIndex(p => p === policy), {
622-
...policy,
623-
write:
624-
write.target.checked,
625-
})
618+
formik.setFieldValue(`policies.${index}.write`, write.target.checked)
626619
}
627620
/>
628621
</td>

‎src/components/shared/wizard/FileUpload.tsx‎

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ const FileUpload = <T extends RequiredFormProps>({
2323
acceptableTypes,
2424
fileId,
2525
fileName,
26+
fileUrlKey,
2627
formik,
2728
isEdit,
2829
}: {
@@ -32,6 +33,7 @@ const FileUpload = <T extends RequiredFormProps>({
3233
acceptableTypes: string,
3334
fileId: string,
3435
fileName: string,
36+
fileUrlKey: string,
3537
formik: FormikProps<T>,
3638
isEdit?: boolean,
3739
}) => {
@@ -46,6 +48,16 @@ const FileUpload = <T extends RequiredFormProps>({
4648
// reference used for activating file input when button is clicked
4749
const hiddenFileInput = useRef<HTMLInputElement>(null);
4850

51+
const existingFileUrl = fileUrlKey ? formik.values[fileUrlKey] as string : undefined;
52+
53+
const displayName = file
54+
? file.name
55+
: (formik.values[fileName] as string);
56+
57+
const displayUrl = file
58+
? URL.createObjectURL(file)
59+
: existingFileUrl;
60+
4961
// Trigger formik validation
5062
// Setting formik fields in a promise callback does not trigger formik
5163
// validation (or at the very least, does not trigger it with the new
@@ -62,6 +74,9 @@ const FileUpload = <T extends RequiredFormProps>({
6274
setLoaded(0);
6375
formik.setFieldValue(fileId, "");
6476
formik.setFieldValue(fileName, "");
77+
if (fileUrlKey) {
78+
formik.setFieldValue(fileUrlKey, "");
79+
}
6580
};
6681

6782
// upload file to backend
@@ -120,11 +135,11 @@ const FileUpload = <T extends RequiredFormProps>({
120135
<div className="content-container">
121136
{/* If user already uploaded a file, its name and a delete button is rendered */}
122137
{/* else render button for upload */}
123-
{!!formik.values[fileId] && file ? (
138+
{(file || existingFileUrl) ? (
124139
<div className="upload-file-info">
125140
<p className={isEdit ? "edit" : ""}>
126-
<a href={URL.createObjectURL(file)} target="_blank" rel="noreferrer">
127-
{formik.values[fileName] as string}
141+
<a href={displayUrl} target="_blank" rel="noreferrer">
142+
{displayName}
128143
</a>
129144
</p>
130145
<div className="button-container">

‎src/components/shared/wizard/RenderMultiField.tsx‎

Lines changed: 14 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -206,27 +206,26 @@ const ShowValue = ({
206206
showCheck,
207207
onBlur,
208208
}: {
209-
setEditMode: (e: boolean) => void
209+
setEditMode: (e: boolean) => void
210210
form: FieldProps["form"]
211211
field: FieldProps["field"]
212212
showCheck: boolean,
213213
onBlur: () => void
214214
}) => {
215215
return (
216-
<div
217-
tabIndex={0}
218-
onClick={() => setEditMode(true)}
219-
onFocus={() => setEditMode(true)} // <-- activate edit mode on focus
220-
onKeyDown={e => {
221-
if (e.key === "Enter" || e.key === " ") {
222-
setEditMode(true);
223-
e.preventDefault();
224-
}
225-
}}
226-
227-
onBlur={onBlur}
228-
className="show-edit"
229-
>
216+
<div
217+
tabIndex={0}
218+
onClick={() => setEditMode(true)}
219+
onFocus={() => setEditMode(true)} // <-- activate edit mode on focus
220+
onKeyDown={e => {
221+
if (e.key === "Enter" || e.key === " ") {
222+
setEditMode(true);
223+
e.preventDefault();
224+
}
225+
}}
226+
onBlur={onBlur}
227+
className="show-edit"
228+
>
230229
{field.value instanceof Array && field.value.length !== 0 ? (
231230
<ul>
232231
{field.value.map((item, key) => (

0 commit comments

Comments
 (0)