Merge pull request #569 from movie-web/fix-some-bugs

Fix numerous bugs

package.json

@@ -1,6 +1,6 @@
 {
   "name": "movie-web",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "private": true,
   "homepage": "https://movie-web.app",
   "scripts": {

src/assets/locales/en.json

@@ -25,6 +25,7 @@
     },
     "generate": {
       "title": "Your passphrase",
+      "passphraseFrameLabel": "Passphrase",
       "next": "I have saved my passphrase",
       "description": "Your passphrase acts as your username and password. Make sure to keep it safe as you will need to enter it to login to your account"
     },

src/backend/helpers/report.ts

@@ -9,6 +9,7 @@ import { PlayerMeta } from "@/stores/player/slices/source";
 // for anybody who cares - these are anonymous metrics.
 // They are just used for figuring out if providers are broken or not
 const metricsEndpoint = "https://backend.movie-web.app/metrics/providers";
+const captchaMetricsEndpoint = "https://backend.movie-web.app/metrics/captcha";
 const batchId = () => nanoid(32);
 
 export type ProviderMetric = {
@@ -136,8 +137,17 @@ export function scrapePartsToProviderMetric(
 export function useReportProviders() {
   const report = useCallback((items: ProviderMetric[]) => {
     if (items.length === 0) return;
-    reportProviders(items);
+    reportProviders(items).catch(() => {});
   }, []);
 
   return { report };
 }
+
+export function reportCaptchaSolve(success: boolean) {
+  ofetch(captchaMetricsEndpoint, {
+    method: "POST",
+    body: {
+      success,
+    },
+  }).catch(() => {});
+}

src/components/form/PassphraseDisplay.tsx

@@ -25,7 +25,9 @@ export function PassphraseDisplay(props: { mnemonic: string }) {
   return (
     <div className="rounded-lg border border-authentication-border/50 ">
       <div className="px-4 py-2 flex justify-between border-b border-authentication-border/50">
-        <p className="font-bold text-sm text-white">Passphrase</p>
+        <p className="font-bold text-sm text-white">
+          {t("auth.generate.passphraseFrameLabel")}
+        </p>
         <button
           type="button"
           className="text-authentication-copyText hover:text-authentication-copyTextHover transition-colors flex gap-2 items-center cursor-pointer"

src/hooks/auth/useAuthData.ts

@@ -24,7 +24,9 @@ export function useAuthData() {
   const clearProgress = useProgressStore((s) => s.clear);
   const setTheme = useThemeStore((s) => s.setTheme);
   const setAppLanguage = useLanguageStore((s) => s.setLanguage);
-  const setCaptionLanguage = useSubtitleStore((s) => s.setLanguage);
+  const importSubtitleLanguage = useSubtitleStore(
+    (s) => s.importSubtitleLanguage
+  );
 
   const replaceBookmarks = useBookmarkStore((s) => s.replaceBookmarks);
   const replaceItems = useProgressStore((s) => s.replaceItems);
@@ -72,7 +74,7 @@ export function useAuthData() {
       }
 
       if (settings.defaultSubtitleLanguage) {
-        setCaptionLanguage(settings.defaultSubtitleLanguage);
+        importSubtitleLanguage(settings.defaultSubtitleLanguage);
       }
 
       if (settings.applicationTheme) {
@@ -83,7 +85,7 @@ export function useAuthData() {
       replaceBookmarks,
       replaceItems,
       setAppLanguage,
-      setCaptionLanguage,
+      importSubtitleLanguage,
       setTheme,
     ]
   );

src/hooks/useSettingsState.ts

@@ -24,7 +24,7 @@ export function useDerived<T>(
   const setter = useCallback<Dispatch<SetStateAction<T>>>(
     (inp) => {
       if (!(inp instanceof Function)) setOverwrite(inp);
-      else setOverwrite((s) => inp(s ?? initial));
+      else setOverwrite((s) => inp(s !== undefined ? s : initial));
     },
     [initial, setOverwrite]
   );

src/pages/Settings.tsx

@@ -196,7 +196,7 @@ export function SettingsPage() {
       <SettingsLayout>
         <div id="settings-account">
           <Heading1 border className="!mb-0">
-            Account
+            {t("settings.account.title")}
           </Heading1>
           {user.account && state.profile.state ? (
             <AccountSettings

src/pages/parts/settings/SidebarPart.tsx

@@ -122,7 +122,7 @@ export function SidebarPart() {
         boundaryElement=".sidebar-boundary"
       >
         <div className="hidden lg:block">
-          <SidebarSection title="Settings">
+          <SidebarSection title={t("global.pages.settings")}>
             {settingLinks.map((v) => (
               <SidebarLink
                 icon={v.icon}

src/stores/turnstile/index.tsx

@@ -2,6 +2,7 @@ import Turnstile, { BoundTurnstileObject } from "react-turnstile";
 import { create } from "zustand";
 import { immer } from "zustand/middleware/immer";
 
+import { reportCaptchaSolve } from "@/backend/helpers/report";
 import { conf } from "@/setup/config";
 
 export interface TurnstileStore {
@@ -52,11 +53,18 @@ export function isTurnstileInitialized() {
   return !!getTurnstile();
 }
 
-export function getTurnstileToken() {
+export async function getTurnstileToken() {
   const turnstile = getTurnstile();
   turnstile?.reset();
   turnstile?.execute();
-  return useTurnstileStore.getState().getToken();
+  try {
+    const token = await useTurnstileStore.getState().getToken();
+    reportCaptchaSolve(true);
+    return token;
+  } catch (err) {
+    reportCaptchaSolve(false);
+    throw err;
+  }
 }
 
 export function TurnstileProvider() {