From 28d03a06a584824295b87a2e7162e50aa828d7fc Mon Sep 17 00:00:00 2001
From: Pas <74743263+Pasithea0@users.noreply.github.com>
Date: Sun, 19 Oct 2025 18:11:45 -0600
Subject: [PATCH] Delete duplicate code and unify source selecting views

There were two because one was used on the atoms settings menu and the other was in place of ScrapePart prior to video playback
---
 .../atoms/settings/SourceSelectingView.tsx    |   9 +-
 src/pages/parts/player/SourceSelectPart.tsx   | 167 +-----------------
 2 files changed, 14 insertions(+), 162 deletions(-)

diff --git a/src/components/player/atoms/settings/SourceSelectingView.tsx b/src/components/player/atoms/settings/SourceSelectingView.tsx
index 6b058ee1..33381010 100644
--- a/src/components/player/atoms/settings/SourceSelectingView.tsx
+++ b/src/components/player/atoms/settings/SourceSelectingView.tsx
@@ -21,6 +21,7 @@ export interface SourceSelectionViewProps {
 export interface EmbedSelectionViewProps {
   id: string;
   sourceId: string | null;
+  onBack?: () => void;
 }
 
 export function EmbedOption(props: {
@@ -60,7 +61,11 @@ export function EmbedOption(props: {
   );
 }
 
-export function EmbedSelectionView({ sourceId, id }: EmbedSelectionViewProps) {
+export function EmbedSelectionView({
+  sourceId,
+  id,
+  onBack,
+}: EmbedSelectionViewProps) {
   const { t } = useTranslation();
   const router = useOverlayRouter(id);
   const { run, watching, notfound, loading, items, errored } =
@@ -126,7 +131,7 @@ export function EmbedSelectionView({ sourceId, id }: EmbedSelectionViewProps) {
 
   return (
     <>
-      <Menu.BackLink onClick={() => router.navigate("/source")}>
+      <Menu.BackLink onClick={onBack || (() => router.navigate("/source"))}>
         {sourceName}
       </Menu.BackLink>
       <Menu.Section>{content}</Menu.Section>
diff --git a/src/pages/parts/player/SourceSelectPart.tsx b/src/pages/parts/player/SourceSelectPart.tsx
index cd371b7d..c5efdbae 100644
--- a/src/pages/parts/player/SourceSelectPart.tsx
+++ b/src/pages/parts/player/SourceSelectPart.tsx
@@ -1,164 +1,20 @@
 import { ScrapeMedia } from "@p-stream/providers";
-import React, { ReactNode, useEffect, useMemo, useRef } from "react";
+import React from "react";
 import { useTranslation } from "react-i18next";
 
-import { getCachedMetadata } from "@/backend/helpers/providerApi";
-import { Loading } from "@/components/layout/Loading";
 import {
-  useEmbedScraping,
-  useSourceScraping,
-} from "@/components/player/hooks/useSourceSelection";
+  EmbedSelectionView,
+  SourceSelectionView,
+} from "@/components/player/atoms/settings/SourceSelectingView";
 import { Menu } from "@/components/player/internals/ContextMenu";
-import { SelectableLink } from "@/components/player/internals/ContextMenu/Links";
-import { usePreferencesStore } from "@/stores/preferences";
-
-// Embed option component
-function EmbedOption(props: {
-  embedId: string;
-  url: string;
-  sourceId: string;
-  routerId: string;
-}) {
-  const { t } = useTranslation();
-  const unknownEmbedName = t("player.menus.sources.unknownOption");
-
-  const embedName = useMemo(() => {
-    if (!props.embedId) return unknownEmbedName;
-    const sourceMeta = getCachedMetadata().find((s) => s.id === props.embedId);
-    return sourceMeta?.name ?? unknownEmbedName;
-  }, [props.embedId, unknownEmbedName]);
-
-  const { run, errored, loading } = useEmbedScraping(
-    props.routerId,
-    props.sourceId,
-    props.url,
-    props.embedId,
-  );
-
-  return (
-    <SelectableLink loading={loading} error={errored} onClick={run}>
-      <span className="flex flex-col">
-        <span>{embedName}</span>
-      </span>
-    </SelectableLink>
-  );
-}
-
-// Embed selection view (when a source is selected)
-function EmbedSelectionView(props: {
-  sourceId: string;
-  routerId: string;
-  onBack: () => void;
-}) {
-  const { t } = useTranslation();
-  const { run, notfound, loading, items, errored } = useSourceScraping(
-    props.sourceId,
-    props.routerId,
-  );
-
-  const sourceName = useMemo(() => {
-    if (!props.sourceId) return "...";
-    const sourceMeta = getCachedMetadata().find((s) => s.id === props.sourceId);
-    return sourceMeta?.name ?? "...";
-  }, [props.sourceId]);
-
-  const lastSourceId = useRef<string | null>(null);
-  useEffect(() => {
-    if (lastSourceId.current === props.sourceId) return;
-    lastSourceId.current = props.sourceId;
-    if (!props.sourceId) return;
-    run();
-  }, [run, props.sourceId]);
-
-  let content: ReactNode = null;
-  if (loading)
-    content = (
-      <Menu.TextDisplay noIcon>
-        <Loading />
-      </Menu.TextDisplay>
-    );
-  else if (notfound)
-    content = (
-      <Menu.TextDisplay
-        title={t("player.menus.sources.noStream.title") ?? undefined}
-      >
-        {t("player.menus.sources.noStream.text")}
-      </Menu.TextDisplay>
-    );
-  else if (items?.length === 0)
-    content = (
-      <Menu.TextDisplay
-        title={t("player.menus.sources.noEmbeds.title") ?? undefined}
-      >
-        {t("player.menus.sources.noEmbeds.text")}
-      </Menu.TextDisplay>
-    );
-  else if (errored)
-    content = (
-      <Menu.TextDisplay
-        title={t("player.menus.sources.failed.title") ?? undefined}
-      >
-        {t("player.menus.sources.failed.text")}
-      </Menu.TextDisplay>
-    );
-  else if (items && props.sourceId)
-    content = items.map((v) => (
-      <EmbedOption
-        key={`${v.embedId}-${v.url}`}
-        embedId={v.embedId}
-        url={v.url}
-        routerId={props.routerId}
-        sourceId={props.sourceId}
-      />
-    ));
-
-  return (
-    <>
-      <Menu.BackLink onClick={props.onBack}>{sourceName}</Menu.BackLink>
-      <Menu.Section>{content}</Menu.Section>
-    </>
-  );
-}
 
 // Main source selection view
-export function SourceSelectPart(props: { media: ScrapeMedia }) {
+export function SourceSelectPart(_props: { media: ScrapeMedia }) {
   const { t } = useTranslation();
   const [selectedSourceId, setSelectedSourceId] = React.useState<string | null>(
     null,
   );
   const routerId = "manualSourceSelect";
-  const preferredSourceOrder = usePreferencesStore((s) => s.sourceOrder);
-  const enableSourceOrder = usePreferencesStore((s) => s.enableSourceOrder);
-
-  const sources = useMemo(() => {
-    const metaType = props.media.type;
-    if (!metaType) return [];
-    const allSources = getCachedMetadata()
-      .filter((v) => v.type === "source")
-      .filter((v) => v.mediaTypes?.includes(metaType));
-
-    if (!enableSourceOrder || preferredSourceOrder.length === 0) {
-      return allSources;
-    }
-
-    // Sort sources according to preferred order
-    const orderedSources = [];
-    const remainingSources = [...allSources];
-
-    // Add sources in preferred order
-    for (const sourceId of preferredSourceOrder) {
-      const sourceIndex = remainingSources.findIndex((s) => s.id === sourceId);
-      if (sourceIndex !== -1) {
-        orderedSources.push(remainingSources[sourceIndex]);
-        remainingSources.splice(sourceIndex, 1);
-      }
-    }
-
-    // Add remaining sources that weren't in the preferred order
-    orderedSources.push(...remainingSources);
-
-    return orderedSources;
-  }, [props.media.type, preferredSourceOrder, enableSourceOrder]);
 
   if (selectedSourceId) {
     return (
@@ -167,7 +23,7 @@ export function SourceSelectPart(props: { media: ScrapeMedia }) {
           <Menu.CardWithScrollable>
             <EmbedSelectionView
               sourceId={selectedSourceId}
-              routerId={routerId}
+              id={routerId}
               onBack={() => setSelectedSourceId(null)}
             />
           </Menu.CardWithScrollable>
@@ -181,16 +37,7 @@ export function SourceSelectPart(props: { media: ScrapeMedia }) {
       <div className="w-full max-w-md h-[50vh] flex flex-col">
         <Menu.CardWithScrollable>
           <Menu.Title>{t("player.menus.sources.title")}</Menu.Title>
-          <Menu.Section className="pb-4">
-            {sources.map((v) => (
-              <SelectableLink
-                key={v.id}
-                onClick={() => setSelectedSourceId(v.id)}
-              >
-                {v.name}
-              </SelectableLink>
-            ))}
-          </Menu.Section>
+          <SourceSelectionView id={routerId} onChoose={setSelectedSourceId} />
         </Menu.CardWithScrollable>
       </div>
     </div>