fix: Advanced request options not saving #543

2026-01-15 23:59:08 +00:00 · 2025-03-02 12:21:24 -05:00
parent 8cb10d1062
commit bd908516b5
3 changed files with 104 additions and 98 deletions
--- a/app/(auth)/(tabs)/(home,libraries,search,favorites)/jellyseerr/page.tsx
+++ b/app/(auth)/(tabs)/(home,libraries,search,favorites)/jellyseerr/page.tsx
@@ -61,6 +61,7 @@ const Page: React.FC = () => {

  const [issueType, setIssueType] = useState<IssueType>();
  const [issueMessage, setIssueMessage] = useState<string>();
+  const [requestBody, _setRequestBody] = useState<MediaRequestBody>();
  const advancedReqModalRef = useRef<BottomSheetModal>(null);
  const bottomSheetModalRef = useRef<BottomSheetModal>(null);

@@ -111,6 +112,11 @@ const Page: React.FC = () => {
    }
  }, [jellyseerrApi, details, result, issueType, issueMessage]);

+  const setRequestBody = useCallback((body: MediaRequestBody) => {
+    _setRequestBody(body)
+    advancedReqModalRef?.current?.present?.();
+  }, [requestBody, _setRequestBody, advancedReqModalRef])
+
  const request = useCallback(async () => {
    const body: MediaRequestBody = {
      mediaId: Number(result.id!!),
@@ -122,7 +128,7 @@ const Page: React.FC = () => {
    };

    if (hasAdvancedRequestPermission) {
-      advancedReqModalRef?.current?.present?.(body);
+      setRequestBody(body)
      return;
    }

@@ -255,7 +261,7 @@ const Page: React.FC = () => {
                refetch={refetch}
                hasAdvancedRequest={hasAdvancedRequestPermission}
                onAdvancedRequest={(data) =>
-                  advancedReqModalRef?.current?.present(data)
+                  setRequestBody(data)
                }
              />
            )}
@@ -269,14 +275,17 @@ const Page: React.FC = () => {
      </ParallaxScrollView>
      <RequestModal
        ref={advancedReqModalRef}
+        requestBody={requestBody}
        title={mediaTitle}
        id={result.id!!}
        type={result.mediaType as MediaType}
        isAnime={isAnime}
        onRequested={() => {
+          _setRequestBody(undefined)
          advancedReqModalRef?.current?.close();
          refetch();
        }}
+        onDismiss={() => _setRequestBody(undefined)}
      />
      <BottomSheetModal
        ref={bottomSheetModalRef}
--- a/components/common/Dropdown.tsx
+++ b/components/common/Dropdown.tsx
@@ -18,7 +18,7 @@ interface Props<T> {
  title: string | ReactNode;
  label: string;
  onSelected: (...item: T[]) => void;
-  multi?: boolean;
+  multiple?: boolean;
 }

 const Dropdown = <T extends unknown>({
@@ -30,7 +30,7 @@ const Dropdown = <T extends unknown>({
  title,
  label,
  onSelected,
-  multi = false,
+  multiple = false,
  ...props
 }: PropsWithChildren<Props<T> & ViewProps>) => {
  if (Platform.isTV) return null;
@@ -72,7 +72,7 @@ const Dropdown = <T extends unknown>({
        >
          <DropdownMenu.Label>{label}</DropdownMenu.Label>
          {data.map((item, idx) =>
-            multi ? (
+            multiple ? (
              <DropdownMenu.CheckboxItem
                value={
                  selected?.some((s) => keyExtractor(s) == keyExtractor(item))
@@ -80,7 +80,7 @@ const Dropdown = <T extends unknown>({
                    : "off"
                }
                key={keyExtractor(item)}
-                onValueChange={(next, previous) =>
+                onValueChange={(next: "on" | "off", previous: "on" | "off") => {
                  setSelected((p) => {
                    const prev = p || [];
                    if (next == "on") {
@@ -92,7 +92,7 @@ const Dropdown = <T extends unknown>({
                      ),
                    ];
                  })
-                }
+                }}
              >
                <DropdownMenu.ItemTitle>
                  {titleExtractor(item)}
--- a/components/jellyseerr/RequestModal.tsx
+++ b/components/jellyseerr/RequestModal.tsx
@@ -15,18 +15,22 @@ import { useTranslation } from "react-i18next";
 interface Props {
  id: number;
  title: string,
+  requestBody?: MediaRequestBody,
  type: MediaType;
  isAnime?: boolean;
  is4k?: boolean;
  onRequested?: () => void;
+  onDismiss?: () => void;
 }

 const RequestModal = forwardRef<BottomSheetModalMethods, Props & Omit<ViewProps, 'id'>>(({
  id,
  title,
+  requestBody,
  type,
  isAnime = false,
  onRequested,
+  onDismiss,
  ...props
 }, ref) => {
  const {jellyseerrApi, jellyseerrUser, requestMedia} = useJellyseerr();
@@ -39,8 +43,6 @@ const RequestModal = forwardRef<BottomSheetModalMethods, Props & Omit<ViewProps,

  const { t } = useTranslation();

-  const [modalRequestProps, setModalRequestProps] = useState<MediaRequestBody>();
-
  const {data: serviceSettings} = useQuery({
    queryKey: ["jellyseerr", "request", type, 'service'],
    queryFn: async () => jellyseerrApi?.service(type == 'movie' ? 'radarr' : 'sonarr'),
@@ -98,16 +100,14 @@ const RequestModal = forwardRef<BottomSheetModalMethods, Props & Omit<ViewProps,
            : defaultServiceDetails?.server.activeTags
          )?.includes(t.id)
        ) ?? []
-
-      console.log(tags)
      return tags
    },
    [defaultServiceDetails]
  );

  const seasonTitle = useMemo(
-    () => modalRequestProps?.seasons?.length ? t("jellyseerr.season_x", {seasons: modalRequestProps?.seasons}) : undefined,
-    [modalRequestProps?.seasons]
+    () => requestBody?.seasons?.length ? t("jellyseerr.season_x", {seasons: requestBody?.seasons}) : undefined,
+    [requestBody?.seasons]
  );

  const request = useCallback(() => {requestMedia(
@@ -117,12 +117,12 @@ const RequestModal = forwardRef<BottomSheetModalMethods, Props & Omit<ViewProps,
        profileId: defaultProfile.id,
        rootFolder: defaultFolder.path,
        tags: defaultTags.map(t => t.id),
-        ...modalRequestProps,
+        ...requestBody,
        ...requestOverrides
      },
      onRequested
    )
-  }, [modalRequestProps, requestOverrides, defaultProfile, defaultFolder, defaultTags]);
+  }, [requestBody, requestOverrides, defaultProfile, defaultFolder, defaultTags]);

  const pathTitleExtractor = (item: RootFolder) => `${item.path} (${item.freeSpace.bytesToReadable()})`;

@@ -131,7 +131,7 @@ const RequestModal = forwardRef<BottomSheetModalMethods, Props & Omit<ViewProps,
      ref={ref}
      enableDynamicSizing
      enableDismissOnClose
-      onDismiss={() => setModalRequestProps(undefined)}
+      onDismiss={onDismiss}
      handleIndicatorStyle={{
        backgroundColor: "white",
      }}
@@ -146,89 +146,86 @@ const RequestModal = forwardRef<BottomSheetModalMethods, Props & Omit<ViewProps,
        />
      }
    >
-      {(data) => {
-        setModalRequestProps(data?.data as MediaRequestBody)
-        return <BottomSheetView>
-          <View className="flex flex-col space-y-4 px-4 pb-8 pt-2">
-            <View>
-              <Text className="font-bold text-2xl text-neutral-100">{t("jellyseerr.advanced")}</Text>
-              {seasonTitle &&
-                  <Text className="text-neutral-300">{seasonTitle}</Text>
-              }
-            </View>
-            <View className="flex flex-col space-y-2">
-              {(defaultService && defaultServiceDetails && users) && (
-                <>
-                  <Dropdown
-                    data={defaultServiceDetails.profiles}
-                    titleExtractor={(item) => item.name}
-                    placeholderText={defaultProfile.name}
-                    keyExtractor={(item) => item.id.toString()}
-                    label={t("jellyseerr.quality_profile")}
-                    onSelected={(item) =>
-                      item && setRequestOverrides((prev) => ({
-                        ...prev,
-                        profileId: item?.id
-                      }))
-                    }
-                    title={t("jellyseerr.quality_profile")}
-                  />
-                  <Dropdown
-                    data={defaultServiceDetails.rootFolders}
-                    titleExtractor={pathTitleExtractor}
-                    placeholderText={defaultFolder ? pathTitleExtractor(defaultFolder) : ""}
-                    keyExtractor={(item) => item.id.toString()}
-                    label={t("jellyseerr.root_folder")}
-                    onSelected={(item) =>
-                      item && setRequestOverrides((prev) => ({
-                        ...prev,
-                        rootFolder: item.path
-                      }))}
-                    title={t("jellyseerr.root_folder")}
-                  />
-                  <Dropdown
-                    multi={true}
-                    data={defaultServiceDetails.tags}
-                    titleExtractor={(item) => item.label}
-                    placeholderText={defaultTags.map(t => t.label).join(",")}
-                    keyExtractor={(item) => item.id.toString()}
-                    label={t("jellyseerr.tags")}
-                    onSelected={(...item) =>
-                      item && setRequestOverrides((prev) => ({
-                        ...prev,
-                        tags: item.map(i => i.id)
-                      }))
-                    }
-                    title={t("jellyseerr.tags")}
-                  />
-                  <Dropdown
-                    data={users}
-                    titleExtractor={(item) => item.displayName}
-                    placeholderText={jellyseerrUser!!.displayName}
-                    keyExtractor={(item) => item.id.toString() || ""}
-                    label={t("jellyseerr.request_as")}
-                    onSelected={(item) =>
-                      item && setRequestOverrides((prev) => ({
-                        ...prev,
-                        userId: item?.id
-                      }))
-                    }
-                    title={t("jellyseerr.request_as")}
-                  />
-                </>
-              )
-              }
-            </View>
-            <Button
-              className="mt-auto"
-              onPress={request}
-              color="purple"
-            >
-              {t("jellyseerr.request_button")}
-            </Button>
+      <BottomSheetView>
+        <View className="flex flex-col space-y-4 px-4 pb-8 pt-2">
+          <View>
+            <Text className="font-bold text-2xl text-neutral-100">{t("jellyseerr.advanced")}</Text>
+            {seasonTitle &&
+                <Text className="text-neutral-300">{seasonTitle}</Text>
+            }
          </View>
-        </BottomSheetView>
-      }}
+          <View className="flex flex-col space-y-2">
+            {(defaultService && defaultServiceDetails && users) && (
+              <>
+                <Dropdown
+                  data={defaultServiceDetails.profiles}
+                  titleExtractor={(item) => item.name}
+                  placeholderText={requestOverrides.profileName || defaultProfile.name}
+                  keyExtractor={(item) => item.id.toString()}
+                  label={t("jellyseerr.quality_profile")}
+                  onSelected={(item) =>
+                    item && setRequestOverrides((prev) => ({
+                      ...prev,
+                      profileId: item?.id
+                    }))
+                  }
+                  title={t("jellyseerr.quality_profile")}
+                />
+                <Dropdown
+                  data={defaultServiceDetails.rootFolders}
+                  titleExtractor={pathTitleExtractor}
+                  placeholderText={defaultFolder ? pathTitleExtractor(defaultFolder) : ""}
+                  keyExtractor={(item) => item.id.toString()}
+                  label={t("jellyseerr.root_folder")}
+                  onSelected={(item) =>
+                    item && setRequestOverrides((prev) => ({
+                      ...prev,
+                      rootFolder: item.path
+                    }))}
+                  title={t("jellyseerr.root_folder")}
+                />
+                <Dropdown
+                  multiple
+                  data={defaultServiceDetails.tags}
+                  titleExtractor={(item) => item.label}
+                  placeholderText={defaultTags.map(t => t.label).join(",")}
+                  keyExtractor={(item) => item.id.toString()}
+                  label={t("jellyseerr.tags")}
+                  onSelected={(...selected) =>
+                    setRequestOverrides((prev) => ({
+                      ...prev,
+                      tags: selected.map(i => i.id)
+                    }))
+                  }
+                  title={t("jellyseerr.tags")}
+                />
+                <Dropdown
+                  data={users}
+                  titleExtractor={(item) => item.displayName}
+                  placeholderText={jellyseerrUser!!.displayName}
+                  keyExtractor={(item) => item.id.toString() || ""}
+                  label={t("jellyseerr.request_as")}
+                  onSelected={(item) =>
+                    item && setRequestOverrides((prev) => ({
+                      ...prev,
+                      userId: item?.id
+                    }))
+                  }
+                  title={t("jellyseerr.request_as")}
+                />
+              </>
+            )
+            }
+          </View>
+          <Button
+            className="mt-auto"
+            onPress={request}
+            color="purple"
+          >
+            {t("jellyseerr.request_button")}
+          </Button>
+        </View>
+      </BottomSheetView>
    </BottomSheetModal>
  );
 });