mirror of
https://github.com/morpheus65535/bazarr
synced 2024-12-21 23:32:31 +00:00
Fixed upload subtitle language (#2675)
This commit is contained in:
Anderson Shindy Oki
GitHub
parent
dd92f408b9
commit
9d8d995d3a
4 changed files with 139 additions and 75 deletions
|
|
@ -1,9 +1,9 @@
|
|||
import { FunctionComponent, useEffect, useMemo } from "react";
|
||||
import React, { FunctionComponent, useEffect, useMemo } from "react";
|
||||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
Divider,
|
||||
MantineColor,
|
||||
Select,
|
||||
Stack,
|
||||
Text,
|
||||
} from "@mantine/core";
|
||||
|
|
@ -17,8 +17,9 @@ import {
|
|||
} from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { isString } from "lodash";
|
||||
import { isString, uniqBy } from "lodash";
|
||||
import { useMovieSubtitleModification } from "@/apis/hooks";
|
||||
import { subtitlesTypeOptions } from "@/components/forms/uploadFormSelectorTypes";
|
||||
import { Action, Selector } from "@/components/inputs";
|
||||
import SimpleTable from "@/components/tables/SimpleTable";
|
||||
import TextPopover from "@/components/TextPopover";
|
||||
|
|
@ -88,7 +89,7 @@ const MovieUploadForm: FunctionComponent<Props> = ({
|
|||
|
||||
const languages = useProfileItemsToLanguages(profile);
|
||||
const languageOptions = useSelectorOptions(
|
||||
languages,
|
||||
uniqBy(languages, "code2"),
|
||||
(v) => v.name,
|
||||
(v) => v.code2,
|
||||
);
|
||||
|
|
@ -207,34 +208,6 @@ const MovieUploadForm: FunctionComponent<Props> = ({
|
|||
return <Text className="table-primary">{file.name}</Text>;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "Forced",
|
||||
accessorKey: "forced",
|
||||
cell: ({ row: { original, index } }) => {
|
||||
return (
|
||||
<Checkbox
|
||||
checked={original.forced}
|
||||
onChange={({ currentTarget: { checked } }) => {
|
||||
action.mutate(index, { ...original, forced: checked });
|
||||
}}
|
||||
></Checkbox>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "HI",
|
||||
accessorKey: "hi",
|
||||
cell: ({ row: { original, index } }) => {
|
||||
return (
|
||||
<Checkbox
|
||||
checked={original.hi}
|
||||
onChange={({ currentTarget: { checked } }) => {
|
||||
action.mutate(index, { ...original, hi: checked });
|
||||
}}
|
||||
></Checkbox>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "Language",
|
||||
accessorKey: "language",
|
||||
|
|
@ -251,6 +224,61 @@ const MovieUploadForm: FunctionComponent<Props> = ({
|
|||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: () => (
|
||||
<Selector
|
||||
options={subtitlesTypeOptions}
|
||||
value={null}
|
||||
placeholder="Type"
|
||||
onChange={(value) => {
|
||||
if (value) {
|
||||
action.update((item) => {
|
||||
switch (value) {
|
||||
case "hi":
|
||||
return { ...item, hi: true, forced: false };
|
||||
case "forced":
|
||||
return { ...item, hi: false, forced: true };
|
||||
case "normal":
|
||||
return { ...item, hi: false, forced: false };
|
||||
default:
|
||||
return item;
|
||||
}
|
||||
});
|
||||
}
|
||||
}}
|
||||
></Selector>
|
||||
),
|
||||
accessorKey: "type",
|
||||
cell: ({ row: { original, index } }) => {
|
||||
return (
|
||||
<Select
|
||||
value={
|
||||
subtitlesTypeOptions.find((s) => {
|
||||
if (original.hi) {
|
||||
return s.value === "hi";
|
||||
}
|
||||
|
||||
if (original.forced) {
|
||||
return s.value === "forced";
|
||||
}
|
||||
|
||||
return s.value === "normal";
|
||||
})?.value
|
||||
}
|
||||
data={subtitlesTypeOptions}
|
||||
onChange={(value) => {
|
||||
if (value) {
|
||||
action.mutate(index, {
|
||||
...original,
|
||||
hi: value === "hi",
|
||||
forced: value === "forced",
|
||||
});
|
||||
}
|
||||
}}
|
||||
></Select>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
id: "action",
|
||||
cell: ({ row: { index } }) => {
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import { FunctionComponent, useEffect, useMemo } from "react";
|
||||
import React, { FunctionComponent, useEffect, useMemo } from "react";
|
||||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
Divider,
|
||||
MantineColor,
|
||||
Select,
|
||||
Stack,
|
||||
Text,
|
||||
} from "@mantine/core";
|
||||
|
|
@ -17,12 +17,13 @@ import {
|
|||
} from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { isString } from "lodash";
|
||||
import { isString, uniqBy } from "lodash";
|
||||
import {
|
||||
useEpisodesBySeriesId,
|
||||
useEpisodeSubtitleModification,
|
||||
useSubtitleInfos,
|
||||
} from "@/apis/hooks";
|
||||
import { subtitlesTypeOptions } from "@/components/forms/uploadFormSelectorTypes";
|
||||
import { Action, Selector } from "@/components/inputs";
|
||||
import SimpleTable from "@/components/tables/SimpleTable";
|
||||
import TextPopover from "@/components/TextPopover";
|
||||
|
|
@ -100,7 +101,7 @@ const SeriesUploadForm: FunctionComponent<Props> = ({
|
|||
const profile = useLanguageProfileBy(series.profileId);
|
||||
const languages = useProfileItemsToLanguages(profile);
|
||||
const languageOptions = useSelectorOptions(
|
||||
languages,
|
||||
uniqBy(languages, "code2"),
|
||||
(v) => v.name,
|
||||
(v) => v.code2,
|
||||
);
|
||||
|
|
@ -235,42 +236,6 @@ const SeriesUploadForm: FunctionComponent<Props> = ({
|
|||
return <Text className="table-primary">{name}</Text>;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "Forced",
|
||||
accessorKey: "forced",
|
||||
cell: ({ row: { original, index } }) => {
|
||||
return (
|
||||
<Checkbox
|
||||
checked={original.forced}
|
||||
onChange={({ currentTarget: { checked } }) => {
|
||||
action.mutate(index, {
|
||||
...original,
|
||||
forced: checked,
|
||||
hi: checked ? false : original.hi,
|
||||
});
|
||||
}}
|
||||
></Checkbox>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "HI",
|
||||
accessorKey: "hi",
|
||||
cell: ({ row: { original, index } }) => {
|
||||
return (
|
||||
<Checkbox
|
||||
checked={original.hi}
|
||||
onChange={({ currentTarget: { checked } }) => {
|
||||
action.mutate(index, {
|
||||
...original,
|
||||
hi: checked,
|
||||
forced: checked ? false : original.forced,
|
||||
});
|
||||
}}
|
||||
></Checkbox>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: () => (
|
||||
<Selector
|
||||
|
|
@ -280,8 +245,7 @@ const SeriesUploadForm: FunctionComponent<Props> = ({
|
|||
onChange={(value) => {
|
||||
if (value) {
|
||||
action.update((item) => {
|
||||
item.language = value;
|
||||
return item;
|
||||
return { ...item, language: value };
|
||||
});
|
||||
}
|
||||
}}
|
||||
|
|
@ -301,6 +265,61 @@ const SeriesUploadForm: FunctionComponent<Props> = ({
|
|||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: () => (
|
||||
<Selector
|
||||
options={subtitlesTypeOptions}
|
||||
value={null}
|
||||
placeholder="Type"
|
||||
onChange={(value) => {
|
||||
if (value) {
|
||||
action.update((item) => {
|
||||
switch (value) {
|
||||
case "hi":
|
||||
return { ...item, hi: true, forced: false };
|
||||
case "forced":
|
||||
return { ...item, hi: false, forced: true };
|
||||
case "normal":
|
||||
return { ...item, hi: false, forced: false };
|
||||
default:
|
||||
return item;
|
||||
}
|
||||
});
|
||||
}
|
||||
}}
|
||||
></Selector>
|
||||
),
|
||||
accessorKey: "type",
|
||||
cell: ({ row: { original, index } }) => {
|
||||
return (
|
||||
<Select
|
||||
value={
|
||||
subtitlesTypeOptions.find((s) => {
|
||||
if (original.hi) {
|
||||
return s.value === "hi";
|
||||
}
|
||||
|
||||
if (original.forced) {
|
||||
return s.value === "forced";
|
||||
}
|
||||
|
||||
return s.value === "normal";
|
||||
})?.value
|
||||
}
|
||||
data={subtitlesTypeOptions}
|
||||
onChange={(value) => {
|
||||
if (value) {
|
||||
action.mutate(index, {
|
||||
...original,
|
||||
hi: value === "hi",
|
||||
forced: value === "forced",
|
||||
});
|
||||
}
|
||||
}}
|
||||
></Select>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
id: "episode",
|
||||
header: "Episode",
|
||||
|
|
|
|||
16
frontend/src/components/forms/uploadFormSelectorTypes.tsx
Normal file
16
frontend/src/components/forms/uploadFormSelectorTypes.tsx
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
import { SelectorOption } from "@/components";
|
||||
|
||||
export const subtitlesTypeOptions: SelectorOption<string>[] = [
|
||||
{
|
||||
label: "Normal",
|
||||
value: "normal",
|
||||
},
|
||||
{
|
||||
label: "Hearing-Impaired",
|
||||
value: "hi",
|
||||
},
|
||||
{
|
||||
label: "Forced",
|
||||
value: "forced",
|
||||
},
|
||||
];
|
||||
|
|
@ -6,6 +6,7 @@ import { faBookmark as farBookmark } from "@fortawesome/free-regular-svg-icons";
|
|||
import { faBookmark, faWrench } from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { uniqueId } from "lodash";
|
||||
import { useMovieModification, useMoviesPagination } from "@/apis/hooks";
|
||||
import { Action } from "@/components";
|
||||
import { AudioList } from "@/components/bazarr";
|
||||
|
|
@ -95,7 +96,7 @@ const MovieView: FunctionComponent = () => {
|
|||
<Badge
|
||||
mr="xs"
|
||||
color="yellow"
|
||||
key={BuildKey(v.code2, v.hi, v.forced)}
|
||||
key={uniqueId(`${BuildKey(v.code2, v.hi, v.forced)}_`)}
|
||||
>
|
||||
<Language.Text value={v}></Language.Text>
|
||||
</Badge>
|
||||
|
|
|
|||
Loading…
Reference in a new issue