1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
|
import Language from "@/components/bazarr/Language";
import SubtitleToolsMenu from "@/components/SubtitleToolsMenu";
import { SimpleTable } from "@/components/tables";
import { useCustomSelection } from "@/components/tables/plugins";
import { withModal } from "@/modules/modals";
import { isMovie } from "@/utilities";
import { Badge, Button, Divider, Group, Stack, Text } from "@mantine/core";
import { FunctionComponent, useMemo, useState } from "react";
import { Column, useRowSelect } from "react-table";
type SupportType = Item.Episode | Item.Movie;
type TableColumnType = FormType.ModifySubtitle & {
raw_language: Language.Info;
};
function getIdAndType(item: SupportType): [number, "episode" | "movie"] {
if (isMovie(item)) {
return [item.radarrId, "movie"];
} else {
return [item.sonarrEpisodeId, "episode"];
}
}
const CanSelectSubtitle = (item: TableColumnType) => {
return item.path.endsWith(".srt");
};
interface SubtitleToolViewProps {
payload: SupportType[];
}
const SubtitleToolView: FunctionComponent<SubtitleToolViewProps> = ({
payload,
}) => {
const [selections, setSelections] = useState<TableColumnType[]>([]);
const columns: Column<TableColumnType>[] = useMemo<Column<TableColumnType>[]>(
() => [
{
Header: "Language",
accessor: "raw_language",
Cell: ({ value }) => (
<Badge color="secondary">
<Language.Text value={value} long></Language.Text>
</Badge>
),
},
{
id: "file",
Header: "File",
accessor: "path",
Cell: ({ value }) => {
const path = value;
let idx = path.lastIndexOf("/");
if (idx === -1) {
idx = path.lastIndexOf("\\");
}
if (idx !== -1) {
return <Text>{path.slice(idx + 1)}</Text>;
} else {
return <Text>{path}</Text>;
}
},
},
],
[],
);
const data = useMemo<TableColumnType[]>(
() =>
payload.flatMap((item) => {
const [id, type] = getIdAndType(item);
return item.subtitles.flatMap((v) => {
if (v.path) {
return [
{
id,
type,
language: v.code2,
path: v.path,
// eslint-disable-next-line camelcase
raw_language: v,
},
];
} else {
return [];
}
});
}),
[payload],
);
const plugins = [useRowSelect, useCustomSelection];
return (
<Stack>
<SimpleTable
tableStyles={{ emptyText: "No external subtitles found" }}
plugins={plugins}
columns={columns}
onSelect={setSelections}
canSelect={CanSelectSubtitle}
data={data}
></SimpleTable>
<Divider></Divider>
<Group>
<SubtitleToolsMenu selections={selections}>
<Button disabled={selections.length === 0} variant="light">
Select Action
</Button>
</SubtitleToolsMenu>
</Group>
</Stack>
);
};
export default withModal(SubtitleToolView, "subtitle-tools", {
title: "Subtitle Tools",
size: "xl",
});
|
