'use client'; import React, { useState } from 'react'; import { LogoutButton, useAuth } from "./auth" import { patreonQuantumSupporterId, strapiUrl } from '../lib/constants'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faSave, faTimes, faCheck } from "@fortawesome/free-solid-svg-icons"; import Skeleton from 'react-loading-skeleton'; interface IArchiveSupporterProps { isNamePublic: boolean; setIsNamePublic: Function; } interface ISaveButtonProps { isDirty: boolean; isLoading: boolean; isSuccess: boolean; isNamePublic: boolean; isLinkPublic: boolean; vanityLink: string; setVanityLink: Function; setIsLoading: Function; setIsSuccess: Function; setIsDirty: Function; setAuthData: Function; errors: String[]; setErrors: Function; } interface IQuantumSupporterProps { isLinkPublic: boolean; hasUrlBenefit: boolean; setIsLinkPublic: Function; vanityLink: string; setVanityLink: Function; } export default function UserControls() { const [isLoading, setIsLoading] = useState(false); const [isSuccess, setIsSuccess] = useState(false); const [isDirty, setIsDirty] = useState(false); const [isNamePublic, setIsNamePublic] = useState(false); const [isLinkPublic, setIsLinkPublic] = useState(false); const [errors, setErrors] = useState([]) const [vanityLink, setVanityLink] = useState('') const { authData, setAuthData } = useAuth() if (!authData) return

Loading...

const hasUrlBenefit = (authData?.user?.patreonBenefits) ? authData.user.patreonBenefits.split(' ').includes(patreonQuantumSupporterId) : false; return (

Patron Perks

); }; export function SaveButton({ isDirty, setIsDirty, isLoading, setIsLoading, setIsSuccess, isSuccess, isNamePublic, isLinkPublic, vanityLink, setVanityLink, setAuthData, errors, setErrors, }: ISaveButtonProps) { const { authData } = useAuth(); const handleClick = async () => { if (!authData?.user) return; try { setIsLoading(true); const response = await fetch(`${strapiUrl}/api/profile/${authData.user.id}`, { method: 'PUT', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${authData.accessToken}` }, body: JSON.stringify({ isNamePublic, isLinkPublic, vanityLink }) }); setIsLoading(false); setIsDirty(true); if (!response.ok) { setIsSuccess(false); } else { setIsSuccess(true); // Update authData if needed const updatedAuthData = { ...authData }; if (!updatedAuthData?.user) return; updatedAuthData.user.vanityLink = vanityLink; updatedAuthData.user.isNamePublic = isNamePublic; updatedAuthData.user.isLinkPublic = isLinkPublic; setAuthData(updatedAuthData); } } catch (error) { if (error instanceof Error) { setErrors(errors.concat([error.message])) } } }; return ( ) } export function Thanks() { return

Thank you so much for supporting Futureporn!

} export function QuantumSupporterPerks({ isLinkPublic, setIsLinkPublic, setVanityLink, vanityLink, hasUrlBenefit }: IQuantumSupporterProps) { const { authData } = useAuth() return (
setVanityLink(e.target.value)} />
) } export function AdvancedArchiveSupporterPerks() { } export function ArchiveSupporterPerks({ isNamePublic, setIsNamePublic }: IArchiveSupporterProps) { const { authData } = useAuth() return (
) }