From ebc8a203c030a57266c8b6a94e6c3d4f46366c2e Mon Sep 17 00:00:00 2001
From: R-J Lim <kgerbil@gmail.com>
Date: Sat, 6 Jan 2024 21:59:12 +0900
Subject: [PATCH] Fix settings in extension popup beeing wrong orientation

---
 common/components/SettingsForm.tsx    | 4 +++-
 extension/src/ui/components/Popup.tsx | 1 +
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/common/components/SettingsForm.tsx b/common/components/SettingsForm.tsx
index 5268650c..192db909 100644
--- a/common/components/SettingsForm.tsx
+++ b/common/components/SettingsForm.tsx
@@ -530,6 +530,7 @@ interface Props {
     localFontsPermission?: PermissionState;
     localFontFamilies: string[];
     supportedLanguages: string[];
+    forceVerticalTabs?: boolean;
     onSettingsChanged: (settings: Partial<AsbplayerSettings>) => void;
     onOpenChromeExtensionShortcuts: () => void;
     onUnlockLocalFonts: () => void;
@@ -549,12 +550,13 @@ export default function SettingsForm({
     localFontsPermission,
     localFontFamilies,
     supportedLanguages,
+    forceVerticalTabs,
     onSettingsChanged,
     onOpenChromeExtensionShortcuts,
     onUnlockLocalFonts,
 }: Props) {
     const theme = useTheme();
-    const smallScreen = useMediaQuery(theme.breakpoints.down('xs'));
+    const smallScreen = useMediaQuery(theme.breakpoints.down('xs')) && !forceVerticalTabs;
     const classes = useStyles({ smallScreen });
     const handleSettingChanged = useCallback(
         async <K extends keyof AsbplayerSettings>(key: K, value: AsbplayerSettings[K]) => {
diff --git a/extension/src/ui/components/Popup.tsx b/extension/src/ui/components/Popup.tsx
index a42a0b47..48e6147b 100644
--- a/extension/src/ui/components/Popup.tsx
+++ b/extension/src/ui/components/Popup.tsx
@@ -90,6 +90,7 @@ const Popup = ({
                 <SettingsForm
                     extensionInstalled
                     extensionSupportsAppIntegration
+                    forceVerticalTabs
                     anki={anki}
                     chromeKeyBinds={chromeCommandBindsToKeyBinds(commands)}
                     settings={settings}