Add rescan button on admin interface

front/packages/ui/src/admin/scanner.tsx

@@ -18,24 +18,44 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Issue, IssueP, QueryIdentifier, useFetch } from "@kyoo/models";
+import { Issue, IssueP, QueryIdentifier, queryFn, useFetch } from "@kyoo/models";
 import { useTranslation } from "react-i18next";
 import { SettingsContainer } from "../settings/base";
-import { Icon, P, Skeleton, tooltip, ts } from "@kyoo/primitives";
+import { Button, Icon, P, Skeleton, tooltip, ts } from "@kyoo/primitives";
 import { ErrorView } from "../errors";
 import { z } from "zod";
 import { View } from "react-native";
 import { useYoshiki } from "yoshiki/native";
 
 import Info from "@material-symbols/svg-400/outlined/info.svg";
+import Scan from "@material-symbols/svg-400/outlined/sensors.svg";
+import { useMutation } from "@tanstack/react-query";
 
 export const Scanner = () => {
 	const { css } = useYoshiki();
 	const { t } = useTranslation();
 	const { data, error } = useFetch(Scanner.query());
 
+	const metadataRefreshMutation = useMutation({
+		mutationFn: () =>
+			queryFn({
+				path: ["rescan"],
+				method: "POST",
+			}),
+	});
+
 	return (
-		<SettingsContainer title={t("admin.scanner.label")}>
+		<SettingsContainer
+			title={t("admin.scanner.label")}
+			extraTop={
+				<Button
+					licon={<Icon icon={Scan} {...css({ marginX: ts(1) })} />}
+					text={t("admin.scanner.scan")}
+					onPress={() => metadataRefreshMutation.mutate()}
+					{...css({ marginBottom: ts(2), })}
+				/>
+			}
+		>
 			<>
 				{error != null ? (
 					<ErrorView error={error} />

front/packages/ui/src/settings/base.tsx

@@ -88,17 +88,20 @@ export const SettingsContainer = ({
 	children,
 	title,
 	extra,
+	extraTop,
 	...props
 }: {
 	children: ReactElement | (ReactElement | Falsy)[] | Falsy;
 	title: string;
 	extra?: ReactElement;
+	extraTop?: ReactElement;
 }) => {
 	const { css } = useYoshiki();
 
 	return (
 		<Container {...props}>
 			<H1 {...css({ fontSize: rem(2) })}>{title}</H1>
+			{extraTop}
 			<SwitchVariant>
 				{({ css }) => (
 					<View

front/translations/en.json

@@ -237,6 +237,7 @@
 		},
 		"scanner": {
 			"label": "Scanner",
+			"scan": "Trigger library scan",
 			"empty": "No issue found. All your items are registered."
 		}
 	}

front/translations/fr.json

@@ -237,6 +237,7 @@
 		},
 		"scanner": {
 			"label": "Scanner",
+			"scan": "Déclencher le scan de la bibliothèque",
 			"empty": "Aucun problème trouvé. Toutes vos vidéos sont enregistrés."
 		}
 	}