diff --git a/src/pages/admin/AdminPage.tsx b/src/pages/admin/AdminPage.tsx index 7f86eedb..ebac03a1 100644 --- a/src/pages/admin/AdminPage.tsx +++ b/src/pages/admin/AdminPage.tsx @@ -2,6 +2,7 @@ import { ThinContainer } from "@/components/layout/ThinContainer"; import { Heading1, Paragraph } from "@/components/utils/Text"; import { SubPageLayout } from "@/pages/layouts/SubPageLayout"; import { ConfigValuesPart } from "@/pages/parts/admin/ConfigValuesPart"; +import { RegionSelectorPart } from "@/pages/parts/admin/RegionSelectorPart"; import { TMDBTestPart } from "@/pages/parts/admin/TMDBTestPart"; import { WorkerTestPart } from "@/pages/parts/admin/WorkerTestPart"; @@ -18,6 +19,7 @@ export function AdminPage() { + ); diff --git a/src/pages/onboarding/Onboarding.tsx b/src/pages/onboarding/Onboarding.tsx index f05b3c05..8a15f639 100644 --- a/src/pages/onboarding/Onboarding.tsx +++ b/src/pages/onboarding/Onboarding.tsx @@ -3,7 +3,6 @@ import { Trans, useTranslation } from "react-i18next"; import { Button } from "@/components/buttons/Button"; import { Toggle } from "@/components/buttons/Toggle"; -import { Dropdown } from "@/components/form/Dropdown"; import { Icon, Icons } from "@/components/Icon"; import { SettingsCard } from "@/components/layout/SettingsCard"; import { Stepper } from "@/components/layout/Stepper"; @@ -37,7 +36,6 @@ import { import { PageTitle } from "@/pages/parts/util/PageTitle"; import { conf } from "@/setup/config"; import { useAuthStore } from "@/stores/auth"; -import { Region, useRegionStore } from "@/utils/detectRegion"; import { getProxyUrls } from "@/utils/proxyUrls"; import { Status, testFebboxToken } from "../parts/settings/SetupPart"; @@ -55,7 +53,6 @@ export function FEDAPISetup() { const [isExpanded, setIsExpanded] = useState(false); const febboxToken = useAuthStore((s) => s.febboxToken); const setFebboxToken = useAuthStore((s) => s.setFebboxToken); - const { region, setRegion } = useRegionStore(); const [status, setStatus] = useState("unset"); const statusMap: Record = { @@ -64,14 +61,6 @@ export function FEDAPISetup() { unset: "noresult", }; - const regionOptions = [ - { id: "us-east", name: "US East" }, - { id: "us-west", name: "US West" }, - { id: "south-america", name: "South America" }, - { id: "asia", name: "Asia" }, - { id: "europe", name: "Europe" }, - ]; - useEffect(() => { const checkTokenStatus = async () => { const result = await getFebboxTokenStatus(febboxToken); @@ -176,21 +165,6 @@ export function FEDAPISetup() { passwordToggleable className="flex-grow" /> -
- r.id === region)?.name || - "US East", - }} - setSelectedItem={(item) => - setRegion(item.id as Region, true) - } - direction="up" - /> -
{status === "error" && (

diff --git a/src/pages/parts/admin/RegionSelectorPart.tsx b/src/pages/parts/admin/RegionSelectorPart.tsx new file mode 100644 index 00000000..3269ce29 --- /dev/null +++ b/src/pages/parts/admin/RegionSelectorPart.tsx @@ -0,0 +1,42 @@ +import { Dropdown } from "@/components/form/Dropdown"; +import { Box } from "@/components/layout/Box"; +import { Heading2 } from "@/components/utils/Text"; +import { Region, useRegionStore } from "@/utils/detectRegion"; + +export function RegionSelectorPart() { + const { region, setRegion } = useRegionStore(); + + const regionOptions = [ + { id: "us-east", name: "US East" }, + { id: "us-west", name: "US West" }, + { id: "south-america", name: "South America" }, + { id: "asia", name: "Asia" }, + { id: "europe", name: "Europe" }, + ]; + + return ( + <> + Region Selector + +

+
+

+ Manually select your preferred region for FED API. This will + override automatic region detection. +

+
+ r.id === region)?.name || "US East", + }} + setSelectedItem={(item) => setRegion(item.id as Region, true)} + direction="up" + /> +
+ + + ); +} diff --git a/src/pages/parts/settings/ConnectionsPart.tsx b/src/pages/parts/settings/ConnectionsPart.tsx index 602737dd..ddfaa2a5 100644 --- a/src/pages/parts/settings/ConnectionsPart.tsx +++ b/src/pages/parts/settings/ConnectionsPart.tsx @@ -9,7 +9,6 @@ import { Trans, useTranslation } from "react-i18next"; import { Button } from "@/components/buttons/Button"; import { Toggle } from "@/components/buttons/Toggle"; -import { Dropdown } from "@/components/form/Dropdown"; import { Icon, Icons } from "@/components/Icon"; import { SettingsCard } from "@/components/layout/SettingsCard"; import { @@ -27,7 +26,6 @@ import { } from "@/pages/parts/settings/SetupPart"; import { conf } from "@/setup/config"; import { useAuthStore } from "@/stores/auth"; -import { Region, useRegionStore } from "@/utils/detectRegion"; interface ProxyEditProps { proxyUrls: string[] | null; @@ -231,7 +229,6 @@ async function getFebboxTokenStatus(febboxToken: string | null) { function FebboxTokenEdit({ febboxToken, setFebboxToken }: FebboxTokenProps) { const { t } = useTranslation(); const [showVideo, setShowVideo] = useState(false); - const { region, setRegion } = useRegionStore(); const [status, setStatus] = useState("unset"); const statusMap: Record = { @@ -240,14 +237,6 @@ function FebboxTokenEdit({ febboxToken, setFebboxToken }: FebboxTokenProps) { unset: "noresult", }; - const regionOptions = [ - { id: "us-east", name: "US East" }, - { id: "us-west", name: "US West" }, - { id: "south-america", name: "South America" }, - { id: "asia", name: "Asia" }, - { id: "europe", name: "Europe" }, - ]; - useEffect(() => { const checkTokenStatus = async () => { const result = await getFebboxTokenStatus(febboxToken); @@ -348,19 +337,6 @@ function FebboxTokenEdit({ febboxToken, setFebboxToken }: FebboxTokenProps) { passwordToggleable className="flex-grow" /> -
- r.id === region)?.name || - "US East", - }} - setSelectedItem={(item) => setRegion(item.id as Region, true)} - direction="up" - /> -
{status === "error" && (