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
125
126
127
128
129
130
|
import { faSearch, faTrash } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import React, { FunctionComponent, useMemo } from "react";
import { Badge } from "react-bootstrap";
import { Column } from "react-table";
import { useProfileItemsToLanguages } from "../../@redux/hooks";
import { useShowOnlyDesired } from "../../@redux/hooks/site";
import { MoviesApi } from "../../apis";
import { AsyncButton, LanguageText, SimpleTable } from "../../components";
import { filterSubtitleBy } from "../../utilites";
const missingText = "Missing Subtitles";
interface Props {
movie: Item.Movie;
disabled?: boolean;
profile?: Language.Profile;
}
const Table: FunctionComponent<Props> = ({ movie, profile, disabled }) => {
const onlyDesired = useShowOnlyDesired();
const profileItems = useProfileItemsToLanguages(profile);
const columns: Column<Subtitle>[] = useMemo<Column<Subtitle>[]>(
() => [
{
Header: "Subtitle Path",
accessor: "path",
Cell: ({ value }) => {
if (value === null || value.length === 0) {
return "Video File Subtitle Track";
} else if (value === missingText) {
return <span className="text-muted">{value}</span>;
} else {
return value;
}
},
},
{
Header: "Language",
accessor: "name",
Cell: ({ row }) => {
if (row.original.path === missingText) {
return (
<Badge variant="primary">
<LanguageText text={row.original} long></LanguageText>
</Badge>
);
} else {
return (
<Badge variant="secondary">
<LanguageText text={row.original} long></LanguageText>
</Badge>
);
}
},
},
{
accessor: "code2",
Cell: (row) => {
const { original } = row.row;
if (original.path === null || original.path.length === 0) {
return null;
} else if (original.path === missingText) {
return (
<AsyncButton
disabled={disabled}
promise={() =>
MoviesApi.downloadSubtitles(movie.radarrId, {
language: original.code2,
hi: original.hi,
forced: original.forced,
})
}
variant="light"
size="sm"
>
<FontAwesomeIcon icon={faSearch}></FontAwesomeIcon>
</AsyncButton>
);
} else {
return (
<AsyncButton
disabled={disabled}
variant="light"
size="sm"
promise={() =>
MoviesApi.deleteSubtitles(movie.radarrId, {
language: original.code2,
hi: original.hi,
forced: original.forced,
path: original.path ?? "",
})
}
>
<FontAwesomeIcon icon={faTrash}></FontAwesomeIcon>
</AsyncButton>
);
}
},
},
],
[movie, disabled]
);
const data: Subtitle[] = useMemo(() => {
const missing = movie.missing_subtitles.map((item) => ({
...item,
path: missingText,
}));
let raw_subtitles = movie.subtitles;
if (onlyDesired) {
raw_subtitles = filterSubtitleBy(raw_subtitles, profileItems);
}
return [...raw_subtitles, ...missing];
}, [movie.missing_subtitles, movie.subtitles, onlyDesired, profileItems]);
return (
<SimpleTable
columns={columns}
data={data}
emptyText="No Subtitles Found For This Movie"
></SimpleTable>
);
};
export default Table;
|
