Skip to content

Commit 556bb1e

Browse files
docs: update readme for AdditionalTranslationsComponentSlot (#2321)
1 parent bd2e2d8 commit 556bb1e

File tree

3 files changed

+52
-1
lines changed

3 files changed

+52
-1
lines changed

src/plugin-slots/AdditionalCourseContentPluginSlot/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@
33
### Slot ID: `org.openedx.frontend.authoring.additional_course_content_plugin.v1`
44

55
### Slot ID Aliases
6-
* `additional_course_content_plugin`
6+
* `additional_course_content_plugin`

src/plugin-slots/AdditionalTranslationsComponentSlot/README.md

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,54 @@
1313
* `additionalProps` - Object
1414
* `transcriptType` - String
1515
* `isAiTranslationsEnabled` - Boolean
16+
17+
18+
## Description
19+
20+
This slot is used to add a custom block in the **Video Transcription Settings** drawer.
21+
22+
## Example
23+
24+
The following `env.config.jsx` will add a custom transcript option in the Transcript Settings drawer.
25+
26+
![Screenshot of the unit sidebar surrounded by border](./images/additional-translation-example.png)
27+
28+
```jsx
29+
import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-framework';
30+
import { Collapsible, Icon } from '@openedx/paragon';
31+
import { ChevronRight } from '@openedx/paragon/icons';
32+
33+
const TranslationsBlock = ({ setIsAiTranslations, courseId }) => (
34+
<div key="transcript-type-selection" className="mt-3">
35+
<Collapsible.Advanced
36+
onOpen={() => setIsAiTranslations(courseId === 'anyId')}
37+
>
38+
<Collapsible.Trigger
39+
className="row m-0 justify-content-between align-items-center"
40+
>
41+
Custom transcript 💬
42+
<Icon src={ChevronRight} />
43+
</Collapsible.Trigger>
44+
</Collapsible.Advanced>
45+
</div>
46+
);
47+
48+
const config = {
49+
pluginSlots: {
50+
'org.openedx.frontend.authoring.video_transcript_additional_translations_component.v1': {
51+
plugins: [
52+
{
53+
op: PLUGIN_OPERATIONS.Insert,
54+
widget: {
55+
id: 'custom_additional_translation_id',
56+
type: DIRECT_PLUGIN,
57+
RenderWidget: TranslationsBlock,
58+
},
59+
},
60+
],
61+
},
62+
},
63+
}
64+
65+
export default config;
66+
```
36.2 KB
Loading

0 commit comments

Comments
 (0)