add consent to share token

src/pages/onboarding/Onboarding.tsx

@@ -49,6 +49,8 @@ export function FEDAPISetup() {
   const [isExpanded, setIsExpanded] = useState(false);
   const febboxToken = useAuthStore((s) => s.febboxToken);
   const setFebboxToken = useAuthStore((s) => s.setFebboxToken);
+  const febboxTokenShared = useAuthStore((s) => s.febboxTokenShared);
+  const setFebboxTokenShared = useAuthStore((s) => s.setFebboxTokenShared);
 
   const [status, setStatus] = useState<Status>("unset");
   const statusMap: Record<Status, StatusCircleProps["type"]> = {
@@ -164,6 +166,27 @@ export function FEDAPISetup() {
               {status === "error" && (
                 <p className="text-type-danger mt-4">Token was unsuccessful</p>
               )}
+
+              <div className="mt-6 flex items-center">
+                <input
+                  type="checkbox"
+                  id="share-token-consent"
+                  checked={febboxTokenShared}
+                  onChange={(e) => setFebboxTokenShared(e.target.checked)}
+                  className="mr-3 mt-0.5 w-4 h-4 accent-buttons-secondary"
+                />
+                <label
+                  htmlFor="share-token-consent"
+                  className="text-type-seccondary cursor-pointer"
+                >
+                  Support FED API by sharing your token?
+                </label>
+              </div>
+              <p className="text-type-secondary text-xs mt-2">
+                If you chose to share your token, it allows anyone to use FED
+                API without bringing their own token! You token is kept private
+                and encrypted.
+              </p>
             </>
           ) : null}
         </SettingsCard>
@@ -219,9 +242,9 @@ export function OnboardingPage() {
           message={
             <div>
               <p>
-                P-Stream doesn’t host videos. It relies on third-party websites
-                for content, so you need to choose how it connects to those
-                sites.
+                P-Stream doesn&apos;t host videos. It relies on third-party
+                websites for content, so you need to choose how it connects to
+                those sites.
                 <br />
                 <br />
                 <strong>Your Options:</strong>
@@ -241,8 +264,8 @@ export function OnboardingPage() {
                 <br />
                 <strong>3. Default Setup</strong>
                 <br />
-                Uses P-Stream’s built-in proxy. It’s the easiest option but
-                might be slower due to shared bandwidth.
+                Uses P-Stream&apos;s built-in proxy. It&apos;s the easiest
+                option but might be slower due to shared bandwidth.
                 <br />
                 <br />
                 {conf().ALLOW_FEBBOX_KEY && (

src/pages/parts/settings/ConnectionsPart.tsx

@@ -207,6 +207,8 @@ function BackendEdit({ backendUrl, setBackendUrl }: BackendEditProps) {
 function FebboxTokenEdit({ febboxToken, setFebboxToken }: FebboxTokenProps) {
   const { t } = useTranslation();
   const [showVideo, setShowVideo] = useState(false);
+  const febboxTokenShared = useAuthStore((s) => s.febboxTokenShared);
+  const setFebboxTokenShared = useAuthStore((s) => s.setFebboxTokenShared);
 
   if (conf().ALLOW_FEBBOX_KEY) {
     return (
@@ -296,6 +298,27 @@ function FebboxTokenEdit({ febboxToken, setFebboxToken }: FebboxTokenProps) {
               placeholder="eyABCdE..."
               passwordToggleable
             />
+
+            <div className="mt-6 flex items-center">
+              <input
+                type="checkbox"
+                id="share-token-consent"
+                checked={febboxTokenShared}
+                onChange={(e) => setFebboxTokenShared(e.target.checked)}
+                className="mr-3 mt-0.5 w-4 h-4 accent-buttons-secondary"
+              />
+              <label
+                htmlFor="share-token-consent"
+                className="text-type-seccondary cursor-pointer"
+              >
+                Support FED API by sharing your token?
+              </label>
+            </div>
+            <p className="text-type-secondary text-xs mt-2">
+              If you chose to share your token, it allows anyone to use FED API
+              without bringing their own token! You token is kept private and
+              encrypted.
+            </p>
           </>
         ) : null}
       </SettingsCard>

src/stores/auth/index.ts

@@ -23,6 +23,7 @@ interface AuthStore {
   backendUrl: null | string;
   proxySet: null | string[];
   febboxToken: null | string;
+  febboxTokenShared: boolean;
   removeAccount(): void;
   setAccount(acc: AccountWithToken): void;
   updateDeviceName(deviceName: string): void;
@@ -31,6 +32,7 @@ interface AuthStore {
   setBackendUrl(url: null | string): void;
   setProxySet(urls: null | string[]): void;
   setFebboxToken(token: null | string): void;
+  setFebboxTokenShared(shared: boolean): void;
 }
 
 export const useAuthStore = create(
@@ -40,6 +42,7 @@ export const useAuthStore = create(
       backendUrl: null,
       proxySet: null,
       febboxToken: null,
+      febboxTokenShared: false,
       setAccount(acc) {
         set((s) => {
           s.account = acc;
@@ -74,6 +77,16 @@ export const useAuthStore = create(
           console.warn("Failed to access localStorage:", e);
         }
       },
+      setFebboxTokenShared(shared) {
+        set((s) => {
+          s.febboxTokenShared = shared;
+        });
+        try {
+          localStorage.setItem("share-token", shared ? "true" : "false");
+        } catch (e) {
+          console.warn("Failed to access localStorage:", e);
+        }
+      },
       setAccountProfile(profile) {
         set((s) => {
           if (s.account) {
@@ -109,6 +122,19 @@ export const useAuthStore = create(
             console.warn("LocalStorage access failed during migration:", e);
           }
         }
+        if (persistedState.febboxTokenShared === undefined) {
+          try {
+            const shareToken = localStorage.getItem("share-token");
+            if (shareToken) {
+              persistedState.febboxTokenShared = shareToken === "true";
+            } else {
+              persistedState.febboxTokenShared = false;
+            }
+          } catch (e) {
+            console.warn("LocalStorage access failed during migration:", e);
+            persistedState.febboxTokenShared = false;
+          }
+        }
         return persistedState;
       },
       onRehydrateStorage: () => (state) => {
@@ -120,6 +146,19 @@ export const useAuthStore = create(
             console.warn("Failed to sync token to localStorage:", e);
           }
         }
+        if (state) {
+          try {
+            localStorage.setItem(
+              "share-token",
+              state.febboxTokenShared ? "true" : "false",
+            );
+          } catch (e) {
+            console.warn(
+              "Failed to sync token sharing preference to localStorage:",
+              e,
+            );
+          }
+        }
       },
     },
   ),