Andal.LND/frontend-app-authoring
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: file upload on safari (#254)

Browse Source 
* fix: file upload on safari

* fix: lint fix
This commit is contained in:
connorhaugh
2023-02-24 10:40:56 -05:00
committed by GitHub
parent a184ac981c
commit 3c3361c765
2 changed files with 117 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/editors/containers/VideoEditor/components/VideoSettingsModal/components/TranscriptWidget/LanguageSelector.jsx
View File

@@ -2,8 +2,13 @@ import React from 'react';
import PropTypes from 'prop-types';
import {
Form,
ActionRow,
Dropdown,
Button,
Icon,
} from '@edx/paragon';
import { Check } from '@edx/paragon/icons';
import { connect, useDispatch } from 'react-redux';
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
import { thunkActions, selectors } from '../../../../../../data/redux';
@@ -15,9 +20,9 @@ import * as module from './LanguageSelector';
export const hooks = {
onSelectLanguage: ({
dispatch, languageBeforeChange, triggerupload, setLocalLang,
}) => (event) => {
}) => ({ newLang }) => {
// IF Language is unset, set language and begin upload prompt.
setLocalLang(event.target.value);
setLocalLang(newLang);
if (languageBeforeChange === '') {
triggerupload();
return;
@@ -25,7 +30,7 @@ export const hooks = {
// Else: update language
dispatch(
thunkActions.video.updateTranscriptLanguage({
newLanguageCode: event.target.value, languageBeforeChange,
newLanguageCode: newLang, languageBeforeChange,
}),
);
},
@@ -54,27 +59,57 @@ export const LanguageSelector = ({
const onLanguageChange = module.hooks.onSelectLanguage({
dispatch: useDispatch(), languageBeforeChange: localLang, setLocalLang, triggerupload: input.click,
});
console.log({ localLang, language, openLanguages });
const getTitle = () => {
if (Object.prototype.hasOwnProperty.call(videoTranscriptLanguages, language)) {
return (
<ActionRow>
{videoTranscriptLanguages[language]}
<ActionRow.Spacer />
<Icon className="text-primary-500" src={Check} />
</ActionRow>
);
}
return (
<ActionRow>
{intl.formatMessage(messages.languageSelectPlaceholder)}
<ActionRow.Spacer />
</ActionRow>
);
};
return (
<div className="col col-11 p-0">
<Form.Group controlId={`selectLanguage-form-${index}`} className="mw-100 m-0">
<Form.Control
as="select"
<>
<Dropdown
className="w-100 mb-2"
>
<Dropdown.Toggle
iconAs={Button}
aria-label={intl.formatMessage(messages.languageSelectLabel)}
defaultValue={language}
onChange={(e) => onLanguageChange(e)}
block
id={`selectLanguage-form-${index}`}
className="w-100"
variant="outline-primary"
>
{getTitle()}
</Dropdown.Toggle>
<Dropdown.Menu>
{Object.entries(videoTranscriptLanguages).map(([lang, text]) => {
if (language === lang) { return (<option value={lang} selected>{text}</option>); }
if (lang === 'placeholder') { return (<option hidden>{intl.formatMessage(messages.languageSelectPlaceholder)}</option>); }
if (openLanguages.some(row => row.includes(lang))) {
return (<option value={lang}>{text}</option>);
if (language === lang) {
return (<Dropdown.Item>{text}<Icon className="text-primary-500" src={Check} /></Dropdown.Item>);
}
return (<option value={lang} disabled>{text}</option>);
if (openLanguages.some(row => row.includes(lang))) {
return (<Dropdown.Item onClick={() => onLanguageChange({ newLang: lang })}>{text}</Dropdown.Item>);
}
return (<Dropdown.Item className="disabled">{text}</Dropdown.Item>);
})}
</Form.Control>
</Form.Group>
</Dropdown.Menu>
</Dropdown>
<FileInput fileInput={input} acceptedFiles=".srt" />
</div>
</>
);
};

114
src/editors/containers/VideoEditor/components/VideoSettingsModal/components/TranscriptWidget/__snapshots__/LanguageSelector.test.jsx.snap
View File

@@ -1,37 +1,45 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`LanguageSelector snapshot transcript option 1`] = `
<div
className="col col-11 p-0"
>
<Form.Group
className="mw-100 m-0"
controlId="selectLanguage-form-undefined"
<Fragment>
<Dropdown
className="w-100 mb-2"
>
<Form.Control
<Dropdown.Toggle
aria-label="Languages"
as="select"
defaultValue="kl"
onChange={[Function]}
block={true}
className="w-100"
iconAs="Button"
id="selectLanguage-form-undefined"
variant="outline-primary"
>
<option
selected={true}
value="kl"
>
<ActionRow>
kLinGon
</option>
<option
value="el"
<ActionRow.Spacer />
<Icon
className="text-primary-500"
/>
</ActionRow>
</Dropdown.Toggle>
<Dropdown.Menu>
<Dropdown.Item>
kLinGon
<Icon
className="text-primary-500"
/>
</Dropdown.Item>
<Dropdown.Item
onClick={[Function]}
>
eLvIsh
</option>
<option
value="sl"
</Dropdown.Item>
<Dropdown.Item
onClick={[Function]}
>
sImLisH
</option>
</Form.Control>
</Form.Group>
</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<FileInput
acceptedFiles=".srt"
fileInput={
@@ -44,43 +52,49 @@ exports[`LanguageSelector snapshot transcript option 1`] = `
}
}
/>
</div>
</Fragment>
`;
exports[`LanguageSelector snapshots -- no transcripts no Open Languages, all should be disabled 1`] = `
<div
className="col col-11 p-0"
>
<Form.Group
className="mw-100 m-0"
controlId="selectLanguage-form-undefined"
<Fragment>
<Dropdown
className="w-100 mb-2"
>
<Form.Control
<Dropdown.Toggle
aria-label="Languages"
as="select"
defaultValue="kl"
onChange={[Function]}
block={true}
className="w-100"
iconAs="Button"
id="selectLanguage-form-undefined"
variant="outline-primary"
>
<option
selected={true}
value="kl"
>
<ActionRow>
kLinGon
</option>
<option
disabled={true}
value="el"
<ActionRow.Spacer />
<Icon
className="text-primary-500"
/>
</ActionRow>
</Dropdown.Toggle>
<Dropdown.Menu>
<Dropdown.Item>
kLinGon
<Icon
className="text-primary-500"
/>
</Dropdown.Item>
<Dropdown.Item
className="disabled"
>
eLvIsh
</option>
<option
disabled={true}
value="sl"
</Dropdown.Item>
<Dropdown.Item
className="disabled"
>
sImLisH
</option>
</Form.Control>
</Form.Group>
</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<FileInput
acceptedFiles=".srt"
fileInput={
@@ -93,5 +107,5 @@ exports[`LanguageSelector snapshots -- no transcripts no Open Languages, all sho
}
}
/>
</div>
</Fragment>
`;