Disable custom theme submit buttons when request sent

app/components/CustomThemeSelector.tsx

@@ -265,6 +265,7 @@ export function CustomThemeSelector({
 	onSave,
 	onReset,
 	hidePatreonInfo,
+	fetcherState,
 }: {
 	initialTheme: CustomTheme | null | undefined;
 	isSupporter: boolean;
@@ -272,6 +273,7 @@ export function CustomThemeSelector({
 	onSave: (themeInput: ThemeInput) => void;
 	onReset: () => void;
 	hidePatreonInfo?: boolean;
+	fetcherState?: "idle" | "submitting" | "loading";
 }) {
 	const { t } = useTranslation(["common"]);
 
@@ -438,11 +440,18 @@ export function CustomThemeSelector({
 				}}
 			/>
 			<div className={styles.customThemeSelectorActions}>
-				<SendouButton isDisabled={!isSupporter} onPress={handleSave}>
+				<SendouButton
+					isDisabled={
+						!isSupporter || (fetcherState != null && fetcherState !== "idle")
+					}
+					onPress={handleSave}
+				>
 					{t("common:actions.save")}
 				</SendouButton>
 				<SendouButton
-					isDisabled={!isSupporter}
+					isDisabled={
+						!isSupporter || (fetcherState != null && fetcherState !== "idle")
+					}
 					variant="destructive"
 					onPress={handleReset}
 				>

app/features/settings/routes/settings.tsx

@@ -252,6 +252,7 @@ function CustomColorSelector() {
 			isSupporter={isSupporter}
 			onSave={handleSave}
 			onReset={handleReset}
+			fetcherState={fetcher.state}
 		/>
 	);
 }

app/features/team/routes/t.$customUrl.edit.tsx

@@ -277,6 +277,7 @@ function TeamCustomThemeSelector() {
 			isPersonalTheme={false}
 			onSave={handleSave}
 			onReset={handleReset}
+			fetcherState={fetcher.state}
 		/>
 	);
 }