\n
\n {children}
\n \n
\n )\n\n if (isError)\n return (\n \n
\n )\n\n if (!mappedHistoryRecipes || !mappedHistoryRecipes.length) {\n return (\n Error
\n\n
\n )\n }\n\n return (\n No image found
\n\n Loading...\n
\n }\n >\n \n \n What a beautiful photo!
\n
\n )}\n \n \n What a beautiful photo!
\n {`Let's join Miss Universe and get rewards!`}\n
\n Select an image you wish to join the competition
\n\n {renderListVoted()}\n
\n \n \n Later\n \n {\n if (!user) {\n setSignInModal({\n signIn: true,\n })\n return\n }\n\n googleAnalytics.event({\n action: \"click\",\n category: \"be_miss_universe_modal\",\n label: \"join_miss_universe\",\n params: {\n image_id: selected?.id ?? \"\",\n image_name: selected?.name ?? \"\",\n image_owner: selected?.owner.name ?? \"\",\n },\n })\n\n setIsOpenModal(true)\n }}\n className=\"bg-atherPurple-500 hover:bg-atherPurple-500 active:bg-atherPurple-500 text-[#EFE8FD] w-full \"\n >\n {\"Join Miss Universe Contest\"}\n \n
\n \n {\n const oldChecked = !checked\n setChecked(oldChecked)\n if (oldChecked) {\n setIsSkipModal(true)\n } else {\n setIsSkipModal(false)\n }\n }}\n name=\"Don't show me again\"\n value=\"1\"\n />\n
\n \n {\n onSubmit()\n\n router.push(\"/ai-recipes/vote-miss-universe?viewMyVoted=true\")\n }}\n className=\"bg-atherPurple-500 hover:bg-atherPurple-500 active:bg-atherPurple-500 text-[#EFE8FD] w-full max-w-[12rem] mb-2\"\n >\n View My Votes\n \n\n
\n )\n}\n\nexport default ViewMyVotes\n","import client from \"@/api/client\"\nimport { useToast } from \"@/hooks\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useMutation, useQueryClient } from \"@tanstack/react-query\"\nimport { isMobileOnly } from \"react-device-detect\"\n\nconst useBeMiss = ({ onSuccess }: { onSuccess?: () => void }) => {\n const toast = useToast({\n position: !isMobileOnly ? \"top-center\" : \"bottom-center\",\n })\n const qc = useQueryClient()\n\n const mutate = useMutation({\n mutationFn: (imageId: string) => {\n googleAnalytics.event({\n action: \"click\",\n category: \"miss_universe_alpha\",\n label: \"submit_join_miss_universe\",\n params: {\n image_id: imageId,\n },\n })\n\n return client.api.missUniverseControllerCreateMissUniverseContestant({\n imageId,\n })\n },\n onSuccess: () => {\n qc.invalidateQueries({ queryKey: [\"vote-miss-universe\"] })\n qc.invalidateQueries({ queryKey: [\"check-participation\"] })\n toast({\n status: \"success\",\n title: \"Thanks for participating!\",\n message: [\"Hope you’ll get the crown! Check your votes at the voting page\"],\n })\n onSuccess?.()\n },\n onError: (error: any) => {\n toast({\n status: \"error\",\n title: \"Error\",\n message: [error?.message || \"Something went wrong.\"],\n })\n },\n })\n\n return mutate\n}\n\nexport default useBeMiss\n","import { SearchIcon, XIcon } from \"@/components/shared/icons/\"\nimport { useCallbackOnHotKeys, useScreen } from \"@/hooks\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport classNames from \"classnames\"\nimport useCustomRouter from \"@/hooks/useCustomRouter\"\nimport React, { Fragment, memo, useEffect, useRef, useState } from \"react\"\nimport { twMerge } from \"tailwind-merge\"\n\ninterface SearchInputProps {\n onFocus: () => void\n onClick: () => void\n onEnter: () => void\n searchDebounce: string\n setSearchDebounce: (query: string) => void\n className?: string\n placeholder?: string\n onClear?: () => void\n}\n\nconst SearchInput = ({\n searchDebounce,\n onClick,\n onClear,\n onEnter,\n onFocus,\n setSearchDebounce,\n className,\n placeholder = \"Search\",\n}: SearchInputProps) => {\n const [searchValue, setSearchValue] = useState(\"\")\n const router = useCustomRouter()\n const { search } = router.query\n\n const inputRef = useRef{`You've submitted your photo to Miss Universe Contest`}
\nNote: You can only 1 photo to the contest
\n\n {\n setActiveEdit(true)\n setTimeout(() => {\n inputRef.current?.focus()\n textareaRef.current?.focus()\n }, 0)\n }}\n className=\"p-[6px]\"\n >\n
\n )}\n \n )}\n \n \n\n {title}
\n\n {title !== \"About me\" &&\n (isActive ? (\n setInputValue(v.target.value)}\n value={inputValue}\n className={classNames(\n \"w-full bg-transparent border-b-[1px] text-sm min-h-[2rem] border-[#4C4B47] text-[#C8C4B5] font-[300] pb-1\",\n {\n \"border-[#DD3A38]\": !!error,\n },\n )}\n />\n ) : (\n \n {inputValue}\n \n ))}\n\n {title === \"About me\" && (\n \n {isLoading ? (\n
\n ) : (\n \n \n e.currentTarget.setSelectionRange(e.currentTarget.value.length, e.currentTarget.value.length)\n }\n onChange={v => setInputValue(v.target.value)}\n value={inputValue}\n className={classNames(\"w-full bg-transparent resize-none text-sm text-[#C8C4B5] font-[300] pb-1\")}\n />\n
\n )}\n \n
\n ) : (\n <>\n {isActive === true ? (\n \n {\n setInputValue(defaultValue)\n setActiveEdit(false)\n onClickClose?.()\n }}\n >\n
\n onSubmit(inputValue)}>\n
\n \n
\n \n )\n}\n\nexport default InputField\n","import IconButton from \"@/components/IconButton\"\nimport Modal from \"@/components/Modal\"\nimport { CloseIcon } from \"@/components/shared/icons\"\nimport Cropper from \"react-easy-crop\"\nimport { FaCheck } from \"react-icons/fa\"\nimport { MdClose } from \"react-icons/md\"\n\ninterface CropImageModalProps {\n preview: string | null\n crop: { x: number; y: number }\n zoom: number\n setCrop: ({ x, y }: { x: number; y: number }) => void\n onCropComplete: (croppedArea: any, croppedAreaPixels: any) => void\n setZoom: (v: number) => void\n showCroppedImage: () => Promise{error}
\n\n
\n Upload image
\n setPreview(null)}>\n
\n \n
\n \n
\n setPreview(null)}>\n
\n Cancel
\n\n
\n Upload
\n\n \n
\n \n
\n \n
\n \n
\n {dataWorkspace?.name}
\nTeam - {totalMember} member(s)
\n\n You can only hand this workspace over to an existing member. Invite the person you'd like to nominate.\n
\n\n {}}\n onClick={() => {}}\n onEnter={() => {}}\n placeholder=\"Search for a workspace member\"\n />\n
\n \n fetchNextPage()}\n hasMore={!!hasNextPage && !isFetching}\n useWindow={false}\n getScrollParent={() => scrollRef.current}\n loader={\n
\n \n Loading...\n
\n }\n >\n {isLoadingWorkspaceMembers ? (\n \n
\n ) : (\n \n {dataMemberList\n ?.filter(member => member.role != WorkspaceRole.Guest && member.role !== WorkspaceRole.Owner)\n ?.map(_i => (\n setCurrentValue(_i.user)}\n />\n ))}\n
\n )}\n \n \n {\n setCurrentValue(undefined)\n setIsOpen(false)\n }}\n >\n {\n if (currentValue) {\n mutateChangeOwner({ newOwnerUid: currentValue.uid, nameOwner: currentValue.name })\n\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `change workspace owner`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n workspace_id: findMyWorkspace?.id ?? \"\",\n },\n value: 1,\n })\n }\n }}\n >\n Change owner\n \n
\n \n Cancel
\n \n\n
\n ),\n style: { backgroundColor: \"transparent\" },\n })\n setIsOpenModal(false)\n window.location.href = \"/workspace\"\n // qc.invalidateQueries({ queryKey: [\"user-workspaces-profile\"] })\n },\n onError: (err: Error) => {\n toast({\n status: \"error\",\n title: err?.message,\n })\n },\n })\n\n const mutateChangeOwner = (data: { newOwnerUid: string; nameOwner: string }) => {\n if (data.newOwnerUid === user?.uid) {\n toast({\n status: \"error\",\n title: \"Currently, you are the workspace's owner.\",\n closeButton: true,\n })\n return\n }\n if (findMyWorkspace?.id) {\n mutateOwner({ newOwnerUid: data.newOwnerUid })\n nameOwner.current = data.nameOwner\n } else {\n toast({\n status: \"error\",\n title: \"WorkspaceID not found: \" + findMyWorkspace?.id,\n })\n }\n }\n\n return {\n members: {\n mappedWorkspaceMembers: dataWorkspaceMembers,\n isLoadingWorkspaceMembers,\n hasNextPage,\n fetchNextPage,\n isFetching,\n isError,\n total,\n },\n mutateUpdateUserWorkspace,\n mutateChangeOwner,\n error,\n setError,\n activeEdit,\n setActiveEdit,\n isLoading,\n isLoadingChangeOwner,\n dataUserWorkspaceById,\n searchDebounce,\n setSearchDebounce,\n isOpenModal,\n setIsOpenModal,\n }\n}\n\nexport { useInfo }\n","import { FileAssociatedResource } from \"@/api/sdk\"\nimport HiddenFileInput from \"@/components/HiddenFileInput\"\nimport IconButton from \"@/components/IconButton\"\nimport LoadingIcon from \"@/components/LoadingIcon\"\nimport { WorkspaceImage } from \"@/components/Workspace/Sidebar/WorkspaceSelector\"\nimport { LeaveIcon, Trash } from \"@/components/shared/icons\"\nimport { useFileUpload, useToast } from \"@/hooks\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useAuth } from \"@/providers/authContext\"\nimport getCroppedImg, { resizeImage } from \"@/utils/resize-image\"\nimport classNames from \"classnames\"\nimport { useCallback, useRef, useState } from \"react\"\nimport InputField from \"../Profile/InputField\"\nimport { useSetting } from \"../SettingProvider\"\nimport CropImageModal from \"../shared/CropImageModal\"\nimport ChangeOwnerModal from \"./ChangeOwnerModal\"\nimport { useInfo } from \"./useInfo\"\nimport { handleConvertHEICtoJPG } from \"@/utils/convert\"\n\nconst Info = () => {\n const { mutateAsync: mutateUpload } = useFileUpload()\n const { findMyWorkspace } = useSetting()\n\n //image crop\n const [crop, setCrop] = useState({ x: 0, y: 0 })\n const [zoom, setZoom] = useState(1)\n const [croppedAreaPixels, setCroppedAreaPixels] = useState(null)\n const { userInfoQuery } = useAuth()\n\n const toast = useToast()\n\n const [preview, setPreview] = useState\n You have successfully transfer {findMyWorkspace?.name} to{\" \"}\n {nameOwner.current}\n
\n\n {!!findMyWorkspace && (\n <>\n handleChangeWorkspacePhoto()}\n onClick={() => {\n handleUploadFromDevice()\n }}\n >\n {\n if (files.length > 0) {\n if (preview && files[0]) {\n URL.revokeObjectURL(preview)\n }\n\n let newFile = files[0]\n\n if (newFile.type === \"image/heic\" || newFile.name.endsWith(\".heic\")) {\n newFile = (await handleConvertHEICtoJPG(newFile)) as File\n }\n\n newFile = await resizeImage(newFile)\n setPreview(URL.createObjectURL(newFile))\n }\n }}\n />\n
\n Workspace photo
\n\n
\n \n {isLoading?.photoId && (\n \n
\n )}\n\n \n
\n \n
\n Upload
\n\n\n {\n setActiveEdit({\n ...activeEdit,\n name: v,\n })\n }}\n isLoading={isLoading?.name}\n onSubmit={v => {\n if (!v) {\n setError(v => ({\n ...v,\n name: \"Invalid name\",\n }))\n return\n }\n if (v === findMyWorkspace.name ?? \"\") {\n setError(v => ({\n ...v,\n name: \"The name is the same as the one from earlier.\",\n }))\n return\n }\n mutateUpdateUserWorkspace({\n name: v,\n })\n\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `edit workspace's name`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n workspace_id: findMyWorkspace.id ?? \"\",\n },\n value: 1,\n })\n }}\n onClickClose={() => {\n setError(v => ({\n ...v,\n name: \"\",\n }))\n }}\n css=\"mb-6\"\n error={error.name}\n />\n\n \n setActiveEdit({\n ...activeEdit,\n description: v,\n })\n }\n isLoading={isLoading?.description}\n onSubmit={v => {\n mutateUpdateUserWorkspace({\n description: v,\n })\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `edit workspace's description`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n workspace_id: findMyWorkspace.id ?? \"\",\n },\n value: 1,\n })\n }}\n onClickClose={() => {\n setError(v => ({\n ...v,\n description: \"\",\n }))\n }}\n css=\"mb-6\"\n error={error.description}\n />\n\n
\n \n )}\n \n \n )\n}\n\nexport default Info\n","import IconButton from \"@/components/IconButton\"\nimport LoadingIcon from \"@/components/LoadingIcon\"\nimport Tooltip from \"@/components/Tooltip\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { AnimatePresence, motion } from \"framer-motion\"\n\ninterface SelectedModalProps {\n selectedBulk: string[]\n onAction: () => void\n iconAction?: React.ReactNode\n isLoading: boolean\n placeHolder: string\n}\n\nconst SelectedModal = ({ selectedBulk, onAction, isLoading, iconAction, placeHolder }: SelectedModalProps) => {\n return (\n \n setIsOpenModal(true)}\n >\n
\n Change team owner
\n\n Remove yourself as the current owner, and nominate another member to replace you. Note: There can only\n be one owner per team.\n
\nChange owner
\n \n\n {isLoading ? (\n
\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"my_account\",\n label: \"delete_selected_items\",\n params: {\n item_id: selectedBulk.join(\",\"),\n pathname: window.location.pathname,\n },\n })\n\n onAction()\n }}\n >\n {iconAction}\n \n }\n >\n {placeHolder}\n \n \n )}\n
\n \n )}\n \n
\n ) : (\n <>\n {selectedBulk.length} selected\n \n
\n
\n \n )\n}\n\nconst roleData = [WorkspaceRole.Member, WorkspaceRole.Guest]\n\nconst AddMember = ({\n isOpen,\n onClose,\n selectedBulk,\n mutateUpdateUserRole,\n setSelectedBulk,\n setSearchDebounce,\n mutateAdd,\n isLimit,\n setIsLimit,\n isLoadingAddAccount,\n}: AddMemberProps) => {\n const [value, setValue] = useState(\"\")\n const [error, setError] = useState(\"\")\n const [role, setRole] = useState(WorkspaceRole.Member)\n const [isConfirm, setIsConfirm] = useState(false)\n const [isPayment, setIsPayment] = useState(false)\n const [selectedPaymentMethod, setSelectedPaymentMethod] = useState(paymentMethods[0].id)\n const [cryptoPayment, setCryptoPayment] = useState<{\n productType: ProductType\n productId: string\n workspaceId?: string\n subscriptionType?: SubscriptionType\n billingCycle?: BillingCycle\n seatCount?: number\n addSeatEmails?: string[]\n } | null>(null)\n\n const router = useCustomRouter()\n const { status } = router.query\n const { userInfoQuery, user } = useAuth()\n const toast = useToast()\n const { currentWorkspaceDetail, refetchUserPlan } = useSetting()\n const { isConnected } = useAccount()\n const { open } = useWeb3Modal()\n const clearUrl = useClearUrlQuery()\n\n const isEditMode = useMemo(() => selectedBulk.some(i => i.id), [selectedBulk])\n\n useEffect(() => {\n if (isOpen && isEditMode) {\n const role = selectedBulk.find(i => i.role)?.role\n\n setRole((role as WorkspaceRole) ?? WorkspaceRole.Member)\n }\n }, [isOpen])\n\n useEffect(() => {\n const id = setTimeout(() => {\n setSearchDebounce(value)\n }, 500)\n return () => {\n clearTimeout(id)\n }\n }, [value])\n\n const handleAddMemberTemp = () => {\n const inputVal = value.trim()\n\n if (!inputVal) {\n return\n }\n if (isEmail(inputVal)) {\n const findIndex = selectedBulk.findIndex(i => i.email === inputVal)\n if (findIndex === -1) {\n setSelectedBulk([...selectedBulk, { email: inputVal, role }])\n }\n setValue(\"\")\n setError(\"\")\n } else {\n setError(\"This email is not accepted\")\n }\n }\n\n const handleKeyDown = event => {\n if (event.key === \"Enter\") {\n handleAddMemberTemp()\n }\n }\n\n const {\n data: userPlan,\n isLoading,\n isSuccess,\n refetch,\n } = useGetUserPlanQuery({\n variables: { workspaceId: userInfoQuery?.data?.currentWorkspace.id ?? \"\" },\n })\n\n const { data: previewAmount } = useGetSubscriptionPreviewAmount({\n variables: {\n subscriptionPackageId: userPlan?.currentSubscription.subscriptionPackageId as string,\n workspaceId: userInfoQuery?.data?.currentWorkspace.id ?? \"\",\n currencyCode: CurrencyCode.USD,\n seatCount: selectedBulk.length,\n subscriptionType: SubscriptionType.AddSeat,\n billingCycle: userPlan?.currentSubscription.billingCycle as BillingCycle,\n },\n enabled: !!userPlan && isPayment,\n })\n\n const { total } = useWorkspaceMembersInfiniteQuery({\n variables: {\n workspaceId: currentWorkspaceDetail?.id ?? \"\",\n roles: [WorkspaceRole.Member, WorkspaceRole.Owner],\n },\n enabled: !!currentWorkspaceDetail,\n })\n\n const [paymentUrl, setPaymentUrl] = useState{email}
\n \n\n
\n \n
\n \n
\n "Started" plan
\n\n x{selectedBulk.length} {selectedBulk.length > 1 ? \"seats\" : \"seat\"}\n
\n \n
\n ${previewAmount?.amountPerSeat ?? 0}
\nuser/{userPlan?.currentSubscription?.billingCycle ?? \"month\"}
\n \n
\n Total
\n${previewAmount?.amount ?? 0}
\n\n
\n \n Payment method
\n\n {paymentMethods\n .filter(method => method.id === userPlan?.currentSubscription.paymentMethod)\n .map((method, index) => (\n \n {index !== 0 &&
}\n\n
\n \n ))}\n }\n
\n \n \n Add\n \n )}\n
\n {isEditMode && selectedBulk.some(i => i.role === WorkspaceRole.Guest) && (\n \n \n {selectedBulk.map((i, index) => (\n {\n const temp = [...selectedBulk]\n const findIndex = selectedBulk.findIndex(_i => _i === i)\n\n temp.splice(findIndex, 1)\n setSelectedBulk(temp)\n }}\n />\n ))}\n {!isEditMode && (\n setValue(v.target.value)}\n onKeyDown={handleKeyDown}\n />\n )}\n
\n {!isEditMode && (\n \n This user has the "Guest" role in your workspace. To allow them to be able to create and\n collaborate with you actively. You can change their role to become a member of your workspace.\n
\n
\n Note: Each member under your workspace will be charged the subscription same as you monthly.\n
{error}
}\n \n\n
\n \n )\n }\n\n return (\n Role
\n\n {roleData.map(i => (\n
\n \n setRole(i)}\n />\n
\n ))}\n \n You have reached the limit of adding members to{\" \"}\n \n {userPlan?.currentSubscription.subscriptionPackageName}\n \n . Upgrade now to add more members.\n
\n ) : isConfirm ? (\n\n Do you want to convert this Workspace Member to a Guest ?
\n As soon as the user is converted to a Guest, they are removed from the subscription and we will release a\n seat (license) to your workspace.\n
\n
\n Guest just can view only.\n
\n
\n And If the user owns any images, folders, styles, macros; all items will be reassigned to the corresponding\n Workspace Owner. The user will still have access to any items they were invited to over email as a Guest\n with view permission.\n
\n {!isEditMode && !isPayment && (\n
\n )}\n \n Bring your whole team to collaborate and unlock the full power of GAIA together.\n
\n )}\n {!isEditMode && isPayment && (\n\n Payment for {selectedBulk.length} seats will be added to your{\" \"}\n {userPlan?.currentSubscription.subscriptionPackageName} renewal invoice.\n
\n )}\n {renderUI()}\n\n
\n \n {currentWorkspaceDetail?.subscriptionPackageId?.toLowerCase() === \"free\" ||\n currentWorkspaceDetail?.subscriptionPackageId?.toLowerCase() === \"newbie\" ? (\n <>\n *You're using {userPlan?.currentSubscription?.subscriptionPackageName} plan for maximum{\" \"}\n \n {total}/{userPlan?.currentSubscription?.maxMembers || \"3\"}\n {\" \"}\n members added to your workspace. To add more{\" \"}\n \n Upgrade your plan.\n \n \n ) : (\n <>\n {selectedPaymentMethod === PaymentMethod.STRIPE && (\n
* Your next payment will include the prorated cost of new seats
\n )}\n * You're using {userPlan?.currentSubscription?.subscriptionPackageName} plan for maximum{\" \"}\n \n {total}/{userPlan?.currentSubscription?.maxMembers || \"20\"}\n {\" \"}\n members added to your workspace.{\" \"}\n\n * Available seats:{\" \"}\n \n {total}/{userPlan?.currentSubscription?.seatCount}\n \n
\n To add more{\" \"}\n \n Upgrade your plan.\n \n \n )}\n \n\n \n Cancel\n \n handleClick()}\n >\n {isLimit\n ? \"Upgrade now\"\n : isEditMode\n ? `${isConfirm ? \"Complete\" : \"Update\"}`\n : currentWorkspaceDetail?.subscriptionPackageId?.toLowerCase() !== \"free\"\n ? isPayment\n ? selectedPaymentMethod === PaymentMethod.STRIPE\n ? \"Update subscription\"\n : \"Process to Payment\"\n : \"Add members\"\n : \"Send invitation\"}\n \n
\n \n\n \n Are you sure to remove{\" \"}\n \n {selectedDelete?.name} ({selectedDelete?.email})\n \n ?\n
\nCancel
\n \nRemove
\n )}\n \n \n\n
\n \n )\n }\n const renderSort = () => {\n return (\n \n {\n setFilters((v: FiltersProps) => ({\n ...v,\n filter: [],\n }))\n }}\n className={classNames(\"cursor-pointer text-xs text-red-500 font-semibold\", {\n hidden: !filters.filter || filters.filter?.length === 0,\n })}\n >\n Clear\n \n
\n Filter
\n\n {filterOptions.map(f => (\n {\n const findIndex = filters.filter?.findIndex(i => i === f.value)\n if (findIndex === -1) {\n const temp = filters.filter\n temp?.push(f.value)\n setFilters((v: FiltersProps) => ({\n ...v,\n filter: temp,\n }))\n } else {\n const temp = filters.filter\n temp?.splice(findIndex, 1)\n setFilters((v: FiltersProps) => ({\n ...v,\n filter: temp,\n }))\n }\n }}\n >\n \n {capitalize(f.title.toLowerCase())}\n \n
\n ))}\n \n
\n )\n }\n\n return (\n \n {sortOptions.map(s => (\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar\",\n value: 1,\n })\n\n if (filters.sort?.title === s.title) {\n setFilters({\n ...filters,\n sort: undefined,\n })\n return\n }\n\n setFilters({\n ...filters,\n sort: s,\n })\n }}\n title=\"Sort by\"\n className={classNames(\n \"flex items-center text-left hover:bg-atherGray-700 bg-transparent w-full cursor-pointer rounded-xl\",\n {\n \"bg-atherGray-800 text-atherGray-0\": filters.sort?.title === s.title,\n \"text-atherGray-300\": filters.sort?.title !== s.title,\n },\n )}\n >\n
\n {capitalize(s.title.toLowerCase())}
\n \n ))}\n\n \n {!!open && (\n \n \n
\n \n )\n}\n\nexport default FilterBar\n","import client from \"@/api/client\"\nimport { SortOrder, WorkspaceMembersSortByOptions, WorkspaceRole, WorkspaceUser } from \"@/api/sdk\"\nimport { useToast } from \"@/hooks\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useMutation, useQueryClient } from \"@tanstack/react-query\"\nimport { useEffect, useState } from \"react\"\nimport { useSetting } from \"../SettingProvider\"\nimport { useUserWorkspaceDetailQuery, useWorkspaceMembersInfiniteQuery } from \"@/queries\"\n\nexport type FiltersProps = {\n sort:\n | {\n title: string\n value: {\n sortBy: WorkspaceMembersSortByOptions\n sortOrder: SortOrder\n }\n }\n | undefined\n filter: WorkspaceRole[]\n}\n\nconst useMembers = () => {\n const { findMyWorkspace, currentWorkspaceDetail } = useSetting()\n const [selectedBulkUser, setSelectedBulkUser] = useState\n {}}\n onClick={() => {}}\n onEnter={() => {}}\n />\n
\n \n \n {\n setOpen(prev => (prev === \"Filter\" ? null : \"Filter\"))\n }}\n >\n {\n setOpen(prev => (prev === \"Sort\" ? null : \"Sort\"))\n }}\n >\n
\n \n {open === \"Filter\" ? renderFilter() : open === \"Sort\" ? renderSort() : null}\n
\n \n )}\n {capitalize(role)}
\n{capitalizeFirstLetter(lastLogin)}
\n\n
\n )\n}\n\nexport default MemberList\n","import IconButton from \"@/components/IconButton\"\nimport { DeleteIcon, PlusIcon } from \"@/components/shared/icons\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useEffect } from \"react\"\nimport { useSetting } from \"../SettingProvider\"\nimport SelectedModal from \"../shared/SelectedModal\"\nimport AddMember from \"./AddMember\"\nimport DeleteModal from \"./DeleteModal\"\nimport FilterBar from \"./Filter\"\nimport { useMembers } from \"./useMembers\"\nimport useCustomRouter from \"@/hooks/useCustomRouter\"\nimport { WorkspaceRole } from \"@/api/sdk\"\nimport MemberList from \"./MemberList\"\n\nconst Members = () => {\n const {\n setSelectedBulkUser,\n selectedUser,\n selectedBulkUser,\n setSelectedUser,\n mutateDeleteAccount,\n isLoadingDeleteAccount,\n handleSelectedAll,\n isOpenAddMember,\n setIsOpenAddMember,\n handleClearAll,\n members,\n search,\n selectedBulkAddUser,\n setSelectedBulkAddUser,\n mutateAdd,\n isLoadingAddAccount,\n filters,\n isLimit,\n setIsLimit,\n mutateUpdateUserRole,\n isLoadingUpdateUserRole,\n setFilters,\n } = useMembers()\n\n const { searchDebounce, setSearchDebounce, setSearchDebounceAddMember } = search\n const { mappedWorkspaceMembers, fetchNextPage, hasNextPage, isFetching, isLoadingWorkspaceMembers } = members\n\n const { userInfoQuery } = useAuth()\n const { findMyWorkspace } = useSetting()\n const router = useCustomRouter()\n\n useEffect(() => {\n const handleQueryPayment = () => {\n const workspaceId = router.query.workspaceId as string\n const emails = router.query.emails as string\n const userWorkspaceId = router.query.userWorkspaceId as string\n\n if (!workspaceId || (!emails && !userWorkspaceId)) return\n\n try {\n if (userWorkspaceId) {\n mutateUpdateUserRole({\n id: parseInt(userWorkspaceId),\n role: WorkspaceRole.Member,\n })\n router.replace(\"/settings/account?tab=Members\", undefined, { shallow: true })\n\n return\n }\n mutateAdd({\n workspaceId,\n emails: emails.split(\",\"),\n role: WorkspaceRole.Member,\n })\n router.replace(\"/settings/account?tab=Members\", undefined, { shallow: true })\n } catch (error) {\n router.replace(\"/settings/account?tab=Members\", undefined, { shallow: true })\n }\n }\n\n if (!router.isReady || !userInfoQuery?.data) return\n\n handleQueryPayment()\n }, [router.isReady, userInfoQuery])\n\n return (\n <>\n \n fetchNextPage()}\n hasMore={!!hasNextPage && !isFetching}\n loader={\n \n \n
\n )}\n \n
\n \n Loading...\n
\n }\n >\n {mappedWorkspaceMembers && (\n | \n \n \n \n | \n \n Role \n | \n \n Last login \n | \n \n |
|---|---|---|---|
| \n \n \n | \n
\n
\n \n )\n}\n\nexport default Members\n","import client from \"@/api/client\"\nimport TogglePublic from \"@/components/Profile/shared/TogglePublic\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useMutation, useQueryClient } from \"@tanstack/react-query\"\n\nconst Privacy = () => {\n const qc = useQueryClient()\n const { userInfoQuery } = useAuth()\n\n const { mutate: mutateToggle, isPending } = useMutation({\n mutationFn: () => client.api.creatorProfileControllerToggleCreatorProfile(),\n onMutate: () => {\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `toggle: user privacy mode`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n },\n onSuccess: () => {\n qc.invalidateQueries({ queryKey: [\"user-info\"] })\n },\n })\n return (\n \n
\n\n \n setIsOpenAddMember(true)}>\n \n
\n New member
\n\n {}}\n className=\"flex w-full\"\n boxClassName=\"flex-1 flex-row-reverse justify-between\"\n />\n
\n )\n}\n\nexport default Privacy\n","import Input from \"@/components/Input\"\nimport Modal from \"@/components/Modal\"\nimport React, { useState } from \"react\"\nimport { FormProvider, useForm, useWatch } from \"react-hook-form\"\nimport PasscodeInput from \"../Security/PasscodeInput\"\nimport IconButton from \"@/components/IconButton\"\nimport { useMutation } from \"@tanstack/react-query\"\nimport client from \"@/api/client\"\nimport { useToast } from \"@/hooks\"\nimport { ConfirmChangeEmailCodeRequestDto } from \"@/api/sdk\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { isEmailAddress, isTelegramEmail } from \"@/utils/is-email-address\"\n\ninterface ChangeEmailModalProps {\n isOpen: boolean\n onClose: () => void\n}\n\ntype ChangeEmailForm = {\n email: string\n code: string\n}\n\nconst ChangeEmailModal = ({ isOpen, onClose }: ChangeEmailModalProps) => {\n const form = useFormPrivacy
\n\n When your account is public, your profile and posts can be seen by anyone, on or off GAIA, even if they don’t\n have an GAIA account.\n
\n\n When your account is private, only the followers you approve can see what you share, including your images,\n macros, articles\n
\n\n You cannot change your email address again for 60 days after the change is saved.\n
\nThis change will also affect Google sign-in.
\n\n handleChangeProfilePhoto()}\n onClick={() => {\n handleUploadFromDevice()\n }}\n >\n {\n if (files.length > 0) {\n if (files[0].size > 10 * 2024 * 2024) {\n toast({\n status: \"error\",\n title: \"File size too large\",\n message: [\"Input image exceeds 10MB, please scale down the image and try again\"],\n })\n return\n }\n\n let newFile = files[0]\n\n if (newFile.type === \"image/heic\" || newFile.name.endsWith(\".heic\")) {\n newFile = (await handleConvertHEICtoJPG(newFile)) as File\n }\n\n newFile = await resizeImage(newFile)\n setPreview(URL.createObjectURL(newFile))\n }\n }}\n ref={fileInputRef}\n />\n
\n \n {isLoading?.avatarFileId && (\n
\n \n
\n )}\n {userInfoQuery.data.picture ? (\n \n {
\n )}\n \n
\n \n
\n Upload
\n\n\n {}}\n isLoading={false}\n onSubmit={v => {}}\n css=\"mb-6\"\n />\n\n {\n setActiveEdit({\n ...activeEdit,\n name: v,\n })\n }}\n isLoading={isLoading?.name}\n onSubmit={v => {\n if (!v) {\n setError(v => ({\n ...v,\n name: \"Invalid name\",\n }))\n return\n }\n if (v === userInfoQuery.data.name ?? \"\") {\n setError(v => ({\n ...v,\n name: \"The name is the same as the one from earlier.\",\n }))\n return\n }\n\n mutateUpdateUserProfile({\n name: v,\n })\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `edit user's name`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n }}\n onClickClose={() => {\n setError(v => ({\n ...v,\n name: \"\",\n }))\n }}\n css=\"mb-6\"\n error={error.name}\n />\n\n {\n if (v) {\n setModal(\"EMAIL\")\n }\n }}\n isLoading={isLoading?.email}\n onSubmit={v => {\n if (v === userInfoQuery.data.email ?? \"\") {\n setError(v => ({\n ...v,\n email: \"The email is the same as the one from earlier.\",\n }))\n return\n }\n\n mutateUpdateUserProfile({\n email: v,\n })\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `edit user's email`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n }}\n onClickClose={() => {\n setError(v => ({\n ...v,\n email: \"\",\n }))\n }}\n css=\"mb-6\"\n error={error.email}\n />\n\n \n setActiveEdit({\n ...activeEdit,\n description: v,\n })\n }\n isLoading={isLoading?.description}\n onSubmit={v => {\n if (v !== undefined && v.length > 300) {\n setError(v => ({\n ...v,\n description: \"It is not accecpted for exceed 300 characters\",\n }))\n return\n }\n\n mutateUpdateUserProfile({\n description: v,\n })\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `edit user's description`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n }}\n onClickClose={() => {\n setError(v => ({\n ...v,\n description: \"\",\n }))\n }}\n css=\"mb-6\"\n error={error.description}\n />\n
\n )\n}\n\nexport default ProfileInfoInput\n","import client from \"@/api/client\"\nimport IconButton from \"@/components/IconButton\"\nimport Modal from \"@/components/Modal\"\nimport { useToast } from \"@/hooks\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { useQueryClient } from \"@tanstack/react-query\"\nimport { getAuth } from \"firebase/auth\"\nimport React from \"react\"\n\ninterface RemoveFarcasterModalProps {\n isOpen: boolean\n onClose: () => void\n}\n\nconst RemoveFarcasterModal = ({ isOpen, onClose }: RemoveFarcasterModalProps) => {\n const toast = useToast()\n const qc = useQueryClient()\n const { user, userInfoQuery } = useAuth()\n\n const handleAgree = async () => {\n try {\n const auth = getAuth()\n\n if (auth.currentUser && auth.currentUser.email) {\n googleAnalytics.handleCategoryEvent({\n action: \"click\",\n params: {\n tab_name: \"profile\",\n action: \"Remove farcaster account\",\n user_name: userInfoQuery?.data?.name ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_email: auth.currentUser.email ?? \"\",\n },\n })\n }\n\n await client.api.userControllerUnlinkFarcaster()\n qc.invalidateQueries({ queryKey: [\"user-info\", user?.uid] })\n toast({\n status: \"success\",\n title: \"Remove social account successfully\",\n message: [\"Your GAIA account has been unlinked with your Farcaster account\"],\n })\n\n onClose()\n } catch (error) {\n console.error(error)\n toast({\n status: \"error\",\n title: \"Remove social account failed\",\n message: [\"Something went wrong, please try again\"],\n })\n }\n }\n\n return (\n \n By clicking Agree button, your GAIA account will be\n unlinked with your Farcaster account\n
\n\n \n Cancel\n \n handleAgree()}>Agree \n
\n \n By clicking Agree button, your GAIA account will be\n unlinked with your Google account\n
\n\n \n Cancel\n \n handleAgree()}>Agree \n
\n \n By clicking Agree button, your GAIA account will be\n unlinked with your Telegram account\n
\n\n \n Cancel\n \n handleAgree()}>Agree \n
\n \n
\n )\n}\n\nexport default SocialsConnected\n","import { useAuth } from \"@/providers/authContext\"\nimport { useState } from \"react\"\nimport ChangeEmailModal from \"./ChangeEmailModal\"\nimport UploadAvatarProfile from \"./UploadAvatarProfile\"\nimport ProfileInfoInput from \"./ProfileInfoInput\"\nimport WalletInfo from \"./WalletInfo\"\nimport RemoveFarcasterModal from \"./RemoveFarcasterModal\"\nimport RemoveSocialModal from \"./RemoveSocialModal\"\nimport RemoveTelegramModal from \"./RemoveTelegramModal\"\nimport useScript from \"@/hooks/useScript\"\nimport SocialsConnected from \"./SocialsConnected\"\n\nconst Profile = () => {\n useScript(\"https://telegram.org/js/telegram-widget.js\")\n const { user, userInfoQuery } = useAuth()\n\n const [modal, setModal] = useState<\"WALLET\" | \"EMAIL\" | \"SOCIAL\" | \"FARCASTER\" | \"TELEGRAM\" | null>(null)\n\n return (\n <>\n Connected social accounts
\nServices that you use to log in to GAIA
\n\n {/* hide link google account if user is a telegram user */}\n {!isTelegramEmail(user.email || \"\") && (\n\n handleClickGoogle()} className=\"p-0 min-h-0\" colorScheme=\"transparent\">\n \n ) : (\n {\n setModal(\"SOCIAL\")\n }}\n colorScheme=\"transparent\"\n className=\"p-0 min-h-0\"\n >\n
\n )}\n\n {!!userDetail?.farcaster && (\n \n 
\n
\n\n {!user.providerData.find(provider => provider.providerId === \"google.com\") ? (\n \n \n Google
\n
\n \n {user.providerData.find(provider => provider.providerId === \"google.com\")?.displayName\n ? user.providerData.find(provider => provider.providerId === \"google.com\")?.displayName ?? \"Unknown\"\n : \"Link your Google account\"}\n
\n\n {\n setModal(\"FARCASTER\")\n }}\n colorScheme=\"transparent\"\n className=\"p-0 min-h-0\"\n >\n
\n )}\n\n \n 
\n
\n \n \n
\n Farcaster
\n{userDetail?.farcaster?.[\"displayName\"]}
\n\n handleLinkTelegramClick()} className=\"p-0 min-h-0\" colorScheme=\"transparent\">\n \n ) : (\n \n \n )}\n
\n \n 
\n
\n {!isLinkedTelegram ? (\n \n \n
\n Telegram
\n\n {isLinkedTelegram ? userDetail?.telegram?.[\"displayName\"] : \"Link your Telegram account\"}\n
\n\n {!!user && !!userInfoQuery?.data && (\n <>\n {\n setModal(null)\n }}\n />\n {\n setModal(null)\n }}\n />\n {\n setModal(null)\n }}\n />\n {\n setModal(null)\n }}\n />\n
\n \n )\n}\n\nexport default Profile\n","import IconButton from \"@/components/IconButton\"\nimport Modal from \"@/components/Modal\"\nimport { cdnPublicFolderUrl } from \"@/constants\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { useEffect } from \"react\"\nimport { useSecurity } from \"../useSecurity\"\n\ninterface AfterDeleteAccountModalProps {\n stateModel: ReturnTypeProfile photo
\n\n
\n \n )}\n \n
\n \n )\n}\n\nexport default AfterDeleteAccountModal\n","import Input from \"@/components/Input\"\nimport Modal from \"@/components/Modal\"\nimport { EyeCloseIcon, EyeIcon } from \"@/components/shared/icons\"\nimport { cn } from \"@/lib/utils\"\nimport React, { useEffect, useState } from \"react\"\nimport { FormProvider, useForm, useWatch } from \"react-hook-form\"\nimport PasscodeInput from \"../PasscodeInput\"\nimport IconButton from \"@/components/IconButton\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { EmailAuthProvider, getAuth, linkWithCredential } from \"firebase/auth\"\nimport { useToast } from \"@/hooks\"\nimport { useMutation } from \"@tanstack/react-query\"\nimport client from \"@/api/client\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { isAcceptPassword, isTelegramEmail } from \"@/utils/is-email-address\"\n\ninterface ChangePasswordModalProps {\n isOpen: boolean\n onClose: () => void\n}\n\ntype ChangePasswordModalForm = {\n email: string\n newPassword: string\n code: string\n}\n\nconst ChangePasswordModal = ({ isOpen, onClose }: ChangePasswordModalProps) => {\n const [isSucess, setIsSuccess] = useState(false)\n const { userInfoQuery } = useAuth()\n const form = useForm\n {\n handleLogoutAll()\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `logout all devices`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n }}\n >\n Log out\n \n
\n\n \n 
\n
\n\n \n \n
\n Account deletion request sent
\n\n You've successfully entered account deletion request. You will be logged out in 15 sec.\n
\nPlease note: Account deletion time may vary
\n\n 
\n
\n \n \n
\n ) : (\n \n Your password has been changed successfully. Use your new password to sign in again\n
\n\n handleSignIn()}>Sign-In Now \n
\n \n Before you delete, please let us know the reason you are leaving.\n
\n\n
\n )}\n \n \n\n I leave because...
\n\n setIsOpen(prev => !prev)}\n >\n
\n {isOpen && (\n \n
\n \n {value}
\n\n {options.map((_i, _index) => (\n {\n setValue(v => ({\n ...v,\n reasonValue: _i,\n }))\n setIsOpen(false)\n }}\n >\n \n {_i}\n \n
\n ))}\n \n \n setStateModel(v => ({\n ...v,\n delete: {\n ...v.delete,\n step1: false,\n },\n }))\n }\n >\n Cancel\n \n {\n setStateModel(v => ({\n ...v,\n delete: {\n ...v.delete,\n step1: false,\n step2: true,\n },\n }))\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `account: delete_reason`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n reason: value,\n },\n value: 1,\n })\n }}\n >\n Next\n \n
\n \n )\n}\n\nexport default DeleteAccountModal\n","import IconButton from \"@/components/IconButton\"\nimport Modal from \"@/components/Modal\"\nimport { cdnUrl } from \"@/constants\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { formatEmail } from \"@/utils/parser\"\nimport classNames from \"classnames\"\nimport PasscodeInput from \"../PasscodeInput\"\nimport { useSecurity } from \"../useSecurity\"\nimport { isTelegramEmail } from \"@/utils/is-email-address\"\n\ninterface EnterCodeModalProps {\n stateModel: ReturnType\n To confirm your account deletion request, please enter the security code that has been sent to your email\n address at {formatEmail(userInfoQuery?.data?.email)}. Please note that after\n 14 days account deletion is irreversible. If you are having problems, please contact hello@{cdnUrl} for\n help deleting your account.\n
\n\n\n If you are having problems, please contact\n \n hello@{cdnUrl}
\n
\n\n Passcode
\n\n
\n \n {isSendToTelegram\n ? \"Because you are signing with Telegram. Please check telegram bot @Proto_GAIA and enter the 6-digit code we sent to you.\"\n : \"Enter the 6-digit code we sent to your email\"}\n
\n\n {\n setValue(v => ({\n ...v,\n passcode: value,\n }))\n }}\n className=\"w-8 h-8 text-xl text-atherGray-0 bg-atherGray-900 rounded-none border-atherGray-800 border-b-[2px]\"\n />\n
\n \n {\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `send_code`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n handleSendCode()\n }}\n >\n Send Code\n \n
\n \n \n setStateModel(v => ({\n ...v,\n delete: {\n ...v.delete,\n step2: false,\n },\n }))\n }\n >\n Cancel\n \n {\n handleComplete()\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `delete account: complete`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n passcode: value,\n },\n value: 1,\n })\n }}\n >\n Complete\n \n
\n \n )\n}\n\nexport default EnterCodeModal\n","import Modal from \"@/components/Modal\"\nimport classNames from \"classnames\"\nimport { useSecurity } from \"../useSecurity\"\nimport IconButton from \"@/components/IconButton\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useAuth } from \"../../../../providers/authContext\"\n\ninterface LogoutModalProps {\n stateModel: ReturnType\n Are you sure? By clicking AGREE button, this will sign you out of all sessions and all devices.\n
\n\n \n setStateModel(v => ({\n ...v,\n logout: false,\n }))\n }\n >\n Cancel\n \n {\n handleLogoutAll()\n googleAnalytics.event({\n action: \"click\",\n category: \"settings_account\",\n label: `logout all devices`,\n params: {\n user_id: userInfoQuery?.data?.uid ?? \"\",\n user_username: userInfoQuery?.data?.username ?? \"\",\n },\n value: 1,\n })\n }}\n isLoading={isLoadingLogoutAll}\n disabled={isLoadingLogoutAll}\n >\n Agree\n \n
\n \n )\n}\n\nexport default LogoutModal\n","import client from \"@/api/client\"\nimport { useToast } from \"@/hooks\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { useMutation } from \"@tanstack/react-query\"\nimport useCustomRouter from \"@/hooks/useCustomRouter\"\nimport { useState } from \"react\"\n\nconst useSecurity = () => {\n const [stateModel, setStateModel] = useState({\n logout: false,\n password: false,\n delete: {\n step1: false,\n step2: false,\n step3: false,\n },\n })\n const toast = useToast({\n position: \"top-center\",\n })\n\n const [stateValue, setStateValue] = useState({\n reasonValue: \"\",\n passcode: \"\",\n })\n\n const { bearerToken, logout } = useAuth()\n const { mutate, isPending: isLoadingLogoutAll } = useMutation({\n mutationKey: [\"logout-all\"],\n mutationFn: () => client.api.userControllerSignOutFromAllDevices(),\n onSettled: () => {\n setStateModel(v => ({\n ...v,\n logout: false,\n }))\n },\n })\n\n const handleLogoutAll = () => {\n if (!bearerToken) {\n toast({\n status: \"error\",\n title: \"Something went wrong\",\n })\n return\n }\n mutate()\n logout()\n }\n\n const { mutate: mutateSendCode, isPending: isLoadingSendCode } = useMutation({\n mutationKey: [\"sendcode-delete-account\", bearerToken],\n mutationFn: () => client.api.userControllerSendAccountDeletionCode(),\n onSuccess: () => {\n toast({\n status: \"success\",\n title: \"The passcode had been sent to your email\",\n })\n },\n onError(error: Error) {\n toast({\n status: \"error\",\n title: error.message,\n })\n },\n })\n\n const handleSendCode = () => {\n if (!bearerToken) {\n toast({\n status: \"error\",\n title: \"Something went wrong\",\n })\n return\n }\n mutateSendCode()\n }\n\n const { mutate: mutateComplete, isPending: isLoadingComplete } = useMutation({\n mutationKey: [\"complete-delete-account\", bearerToken],\n mutationFn: ({ reason, code }: { reason: string; code: string }) =>\n client.api.userControllerRequestDeleteAccount({\n reason,\n code,\n }),\n onSuccess: () => {\n setStateModel(v => ({\n ...v,\n delete: {\n step1: false,\n step2: false,\n step3: true,\n },\n }))\n },\n onError: error => {\n toast({\n status: \"error\",\n title: error.message,\n })\n },\n })\n\n const handleComplete = () => {\n if (!bearerToken || stateValue.passcode === \"\") {\n toast({\n status: \"error\",\n title: \"Something went wrong\",\n })\n return\n }\n\n mutateComplete({\n reason: stateValue.reasonValue,\n code: stateValue.passcode,\n })\n }\n\n return {\n stateModel,\n setStateModel,\n handleLogoutAll,\n isLoadingLogoutAll,\n isLoadingSendCode,\n stateValue,\n setStateValue,\n handleComplete,\n handleSendCode,\n isLoadingComplete,\n }\n}\n\nexport { useSecurity }\n","import { BackupRequestStatus, WorkspaceDetail } from \"@/api/sdk\"\nimport IconButton from \"@/components/IconButton\"\nimport { FileIcon } from \"@/components/shared/icons\"\nimport { useToast } from \"@/hooks\"\nimport useCustomRouter from \"@/hooks/useCustomRouter\"\nimport { useGetBackupStatusQuery, useRequestBackupMutation } from \"@/queries\"\nimport { format } from \"date-fns\"\nimport React from \"react\"\n\ninterface BackupDataProps {\n workspaceDetail?: WorkspaceDetail\n}\n\nconst BackupData = ({ workspaceDetail }: BackupDataProps) => {\n const { openNewTab } = useCustomRouter()\n const toast = useToast()\n\n const { mutate: mutateRequestBackup, isPending: isMutatingRequest } = useRequestBackupMutation()\n const { data: backupData } = useGetBackupStatusQuery({\n refetchOnWindowFocus: true,\n enabled: !!workspaceDetail && workspaceDetail.subscriptionPackageId !== \"free\",\n })\n\n const renderBackupUIComplete = () => {\n if (!backupData) return null\n\n return (\n \n {\n setTimeout(() => {\n if (!backupData?.downloadUrl) return\n\n openNewTab(backupData?.downloadUrl)\n }, 1)\n }}\n className=\"flex items-center mb-2 cursor-pointer space-x-2 text-sm\"\n >\n
\n backup-file
\n\n Your backup data file will be expired on{\" \"}\n {backupData.expireAt ? format(new Date(backupData.expireAt), \"dd MMM yyyy\") : \"\"}. Please download soon.\n
\n \n )\n }\n\n if (!workspaceDetail || workspaceDetail?.subscriptionPackageId === \"free\") return null\n\n return (\n <>\n\n \n mutateRequestBackup(\n {},\n {\n onError: err => {\n toast({\n title: \"Backup failed\",\n message: [err.message],\n status: \"error\",\n })\n },\n },\n )\n }\n >\n Backup data\n \n )}\n
\n Backup data
\n\n You can request to download your data (uploads and designs) on GAIA every 24hrs.\n
\n {backupData && backupData.status === BackupRequestStatus.Available ? (\n renderBackupUIComplete()\n ) : (\n\n \n )\n}\n\nexport default BackupData\n","import IconButton from \"@/components/IconButton\"\nimport { DeleteIcon } from \"@/components/shared/icons\"\nimport React from \"react\"\n\ninterface DeleteAccountProps {\n onDelete: () => void\n}\n\nconst DeleteAccount = ({ onDelete }: DeleteAccountProps) => {\n return (\n
\n onDelete()}>\n \n
\n )\n}\n\nexport default DeleteAccount\n","import IconButton from \"@/components/IconButton\"\nimport React from \"react\"\n\ninterface SignOutAllDeviceProps {\n onSignOutAllDevice: () => void\n}\n\nconst SignOutAllDevice = ({ onSignOutAllDevice }: SignOutAllDeviceProps) => {\n return (\n Delete your account
\n\n By deleting your account, you'll no longer be able to access any of your designs or log in.\n
\nDelete account
\n\n onSignOutAllDevice()}>\n \n
\n )\n}\n\nexport default SignOutAllDevice\n","import IconButton from \"@/components/IconButton\"\nimport { format } from \"date-fns\"\nimport { User } from \"firebase/auth\"\nimport React from \"react\"\n\ninterface SetupPasswordProps {\n user: User | null\n onSetPassword: () => void\n}\n\nconst SetupPassword = ({ user, onSetPassword }: SetupPasswordProps) => {\n const isHavePasswordProvider = user?.providerData.some(provider => provider.providerId === \"password\")\n\n return (\n Sign out from all device
\n\n Logged in on a shared device but forgot to sign out? End all sessions by signing out from all devices.\n
\nSign out from all devices
\n\n onSetPassword()}>\n \n
\n )\n}\n\nexport default SetupPassword\n","import { useAuth } from \"@/providers/authContext\"\nimport { useSetting } from \"../SettingProvider\"\nimport AfterDeleteAccountModal from \"./modal/AfterDeleteAccountModal\"\nimport ChangePasswordModal from \"./modal/ChangePasswordModal\"\nimport DeletetAccountModal from \"./modal/DeleteAccoutModal\"\nimport EnterCodeModal from \"./modal/EnterCodeModal\"\nimport LogoutModal from \"./modal/LogoutModal\"\nimport { useSecurity } from \"./useSecurity\"\nimport BackupData from \"./BackupData\"\nimport DeleteAccount from \"./DeleteAccount\"\nimport SignOutAllDevice from \"./SignOutAllDevice\"\nimport SetupPassword from \"./SetupPassword\"\n\nconst Security = () => {\n const {\n setStateModel,\n stateModel,\n isLoadingLogoutAll,\n handleLogoutAll,\n handleSendCode,\n isLoadingSendCode,\n stateValue,\n setStateValue,\n handleComplete,\n isLoadingComplete,\n } = useSecurity()\n\n const { user } = useAuth()\n const { currentWorkspaceDetail } = useSetting()\n\n return (\n <>\n Password
\n {isHavePasswordProvider && (user as any)?.reloadUserInfo?.passwordUpdatedAt && (\n\n Password last updated: {format(new Date((user as any)?.reloadUserInfo?.passwordUpdatedAt), \"dd MMM yyyy\")}\n
\n )}\n\n\n {isHavePasswordProvider ? \"Change password\" : \"Set password\"}\n
\n\n \n setStateModel(v => ({\n ...v,\n password: true,\n }))\n }\n />\n
\n\n setStateModel(v => ({\n ...v,\n logout: true,\n }))\n }\n />\n
\n\n setStateModel(v => ({\n ...v,\n delete: {\n ...v.delete,\n step1: true,\n },\n }))\n }\n />\n
\n\n \n
\n
\n Are you sure to leave{\" \"}\n \n {selectedWorkspace && selectedWorkspace?.length === 1\n ? selectedWorkspace?.[0].name\n : `${selectedWorkspace?.length} workspaces`}\n \n ?\n
\n {userInfoQuery?.data?.currentWorkspace && (\n\n {selectedWorkspace?.map(i => i.id).includes(userInfoQuery?.data?.currentWorkspace?.id)\n ? \"You are currently in the workspace you are trying to leave.\"\n : \"\"}\n
\n )}\n\n \n \n {\n const ids = selectedWorkspace?.map(_i => _i.id)\n\n if (!ids) return\n\n handleLeaveWorkspaces(ids)\n }}\n >\n {isLoadingMutateLeaveWorkspace ? (\n
\n Cancel
\nLeave
\n )}\n \n\n {findMySharedWorkspace?.length === 0 ? (\n \n \n
\n )}\n
\n \n )\n}\n\nexport default SharedWorkspace\n","import IconButton from \"@/components/IconButton\"\nimport LoadingLogo from \"@/components/LoadingLogo\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { useGetBillingsQuery } from \"@/queries\"\nimport format from \"date-fns/format\"\nimport React from \"react\"\nimport Papa from \"papaparse\"\nimport { FileExportIcon } from \"@/components/shared/icons\"\nimport { PaymentMethod } from \"@/api/sdk\"\nimport { currency } from \"@/utils/currency\"\n\nconst ListBillings = () => {\n const { userInfoQuery } = useAuth()\n\n const { data: billings, isLoading } = useGetBillingsQuery({\n variables: {\n workspaceId: userInfoQuery?.data?.currentWorkspace?.id ?? \"\",\n },\n })\n\n if (isLoading) {\n return (\n \n {/*
\n ) : (\n There was no shared workspace discovered.
*/}\n| \n \n \n \n | \n \n Role \n | \n \n Last login \n | \n \n |
|---|
\n
\n )\n }\n\n return (\n \n
\n )\n}\n\nexport default ListBillings\n","import { PaymentMethod, PaymentPlatform, WorkspacePaymentInfoItem } from \"@/api/sdk\"\nimport { Radio } from \"@/components/Alpha/View/GalleryFilter\"\nimport IconButton from \"@/components/IconButton\"\nimport Modal from \"@/components/Modal\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { useGetPaymentInfoQuery, useUpdatePaymentMethodMutation, useUpdateStripePaymentMutation } from \"@/queries\"\nimport { useState } from \"react\"\nimport { paymentMethods } from \"../UpgradeAccount\"\n\ninterface BillingInfoModalProps {\n isOpen: boolean\n onClose: () => void\n onPaymentUrl?: (url: string) => void\n onPaymentSecret?: (secret: string | null) => void\n}\n\nconst platformMethodMap = {\n [PaymentPlatform.STRIPE]: PaymentMethod.STRIPE,\n [PaymentPlatform.Value2C2P]: PaymentMethod.Value2C2P,\n}\n\nconst BillingInfoModal = ({ isOpen, onClose, onPaymentUrl, onPaymentSecret }: BillingInfoModalProps) => {\n const { userInfoQuery } = useAuth()\n\n const { data: workspacePaymentInfo = [] } = useGetPaymentInfoQuery({\n variables: {\n workspaceId: userInfoQuery?.data?.currentWorkspace.id ?? \"\",\n },\n })\n\n const { mutate: mutateUpdatePaymentMethod, isPending: isUpdating } = useUpdatePaymentMethodMutation({\n onSuccess: data => {\n onPaymentUrl?.(data.url)\n onPaymentSecret?.(data.clientSecret as string)\n },\n })\n\n const { mutate: mutateUpdateStripePaymentMethod, isPending: isUpdatingStripe } = useUpdateStripePaymentMutation({\n onSuccess: data => {\n onPaymentUrl?.(data.url)\n onPaymentSecret?.(data.clientSecret as string)\n },\n })\n\n const [selectedPaymentInfoItem, setPaymentInfoItem] = useState\n {\n const data =\n billings?.orders.map(order => ({\n invoice: order.invoice?.id,\n date: order.createdAt ? format(new Date(order.createdAt), \"MMM dd, yyyy\") : \"\",\n amount: order.invoice\n ? order.invoice?.payment?.[\"paymentMethod\"] === PaymentMethod.CRYPTO\n ? `${currency(parseFloat(order.invoice?.payment?.[\"amount\"]) / 10 ** 6, {\n maximumFractionDigits: 5,\n })} ${order.invoice?.payment?.[\"currencyCode\"]}`\n : Intl.NumberFormat(\"en-US\", {\n style: \"currency\",\n currency: order.invoice?.payment?.[\"currencyCode\"] ?? \"USD\",\n }).format(parseFloat(order.invoice?.payment?.[\"amount\"]))\n : order.totalAmount,\n paymentMethod: order.paymentMethod,\n plan: order.productDetail.name,\n })) ?? []\n\n const csv = Papa.unparse(data)\n\n const blob = new Blob([csv], { type: \"text/csv\" })\n const url = URL.createObjectURL(blob)\n const a = document.createElement(\"a\")\n a.href = url\n a.download = `${\"billings\"}.csv`\n a.click()\n }}\n className=\"p-2\"\n leftIcon={
\n Billings
\n\n \n \n
\n
\n | INVOICE | \nDATE | \nAMOUNT | \nPAYMENT METHOD | \nPLAN | \n
|---|---|---|---|---|
| {order.invoice?.id} | \n\n {order.createdAt ? format(new Date(order.createdAt), \"MMM dd, yyyy\") : \"\"}\n | \n\n {order.invoice\n ? order.invoice?.payment?.[\"paymentMethod\"] === PaymentMethod.CRYPTO\n ? `${currency(parseFloat(order.invoice?.payment?.[\"amount\"]) / 10 ** 6, {\n maximumFractionDigits: 5,\n })} ${order.invoice?.payment?.[\"currencyCode\"]}`\n : Intl.NumberFormat(\"en-US\", {\n style: \"currency\",\n currency: order.invoice?.payment?.[\"currencyCode\"] ?? \"USD\",\n }).format(parseFloat(order.invoice?.payment?.[\"amount\"]))\n : order.totalAmount}\n | \n{order.paymentMethod} | \n{order.productDetail.name} | \n
\n
\n \n This applies to fiat payments with Stripe. When you change your card information (change to a new card), you\n will be charged a small fee (1 USD) to make this request.\n
\nThis amount will be refunded to your account afterwards.
\n\n {workspacePaymentInfo.map(item => (\n
\n \n {\n setPaymentInfoItem(item)\n }}\n value={item.id}\n name={item.creditCard}\n leftIcon={\n
\n ))}\n \n
\n }\n />\n \n method.id === platformMethodMap[item.platform])?.icon}\n alt=\"\"\n className=\"w-8 h-8\"\n />\n
\n \n \n Cancel\n \n {\n if (selectedPaymentInfoItem?.platform === PaymentPlatform.Value2C2P) {\n mutateUpdatePaymentMethod({\n subscriptionId: userInfoQuery?.data?.subscription.id ?? \"\",\n data: {\n paymentMethod: PaymentMethod.Value2C2P,\n },\n })\n return\n }\n if (selectedPaymentInfoItem?.platform === PaymentPlatform.STRIPE) {\n mutateUpdateStripePaymentMethod({ subscriptionId: userInfoQuery?.data?.subscription.id ?? \"\" })\n return\n }\n }}\n >\n Update Now\n \n
\n \n
\n \n ))}\n \n \n The payment method will apply to subscription payments
\n\n For Stripe, when you setup, it will perform auto recurring payment when the payment period comes.\n
\nYou should change the payment method before the next payment period.
\n\n {paymentMethods.map((method, index) => (\n \n {index !== 0 &&
}\n\n \n {method.id === PaymentMethod.CRYPTO ? (\n 
\n )}\n
\n }\n checked={selectedPaymentMethod === method.id}\n onChange={() => {\n if (method.isDisabled) return\n setSelectedPaymentMethod(method.id)\n }}\n />\n }\n
\n
\n ) : (\n \n
\n \n \n Cancel\n \n {\n mutateUpdatePaymentMethod({\n subscriptionId: userInfoQuery?.data?.subscription.id ?? \"\",\n data: {\n paymentMethod: selectedPaymentMethod,\n },\n })\n }}\n >\n Change\n \n
\n \n
\n \n \n \n \n setIsOpen(true)}\n className=\"bg-blackAlpha-600 py-2.5 mr-2 rounded-xl hover:bg-blackAlpha-500 active:bg-blackAlpha-500\"\n >\n Renew\n \n )}\n {userPlan?.currentSubscription?.subscriptionPackageId?.toLowerCase() !== \"free\" && !isTrial ? (\n userPlan?.currentSubscription.requestedCancel ? null : (\n setModal(\"UNSUBSCRIBE\")}\n className=\"bg-black text-red-500 py-2.5 rounded-xl hover:bg-atherGray-900 active:bg-atherGray-900\"\n >\n Unsubscribe\n \n )\n ) : (\n router.push(\"/settings/account?tab=Plans\")}\n className=\"bg-blackAlpha-600 py-2.5 rounded-xl hover:bg-blackAlpha-500 active:bg-blackAlpha-500\"\n >\n Upgrade your plan\n \n )}\n
\n \n
\n {userPlan?.currentSubscription.status === SubscriptionStatus.PastDue && (\n \n {loadingContent(\n (userPlan?.currentSubscription.subscriptionPackageName ?? \"\") + (isTrial ? \" (TRIAL)\" : \"\"),\n isLoadingUserPlan,\n )}\n
\n {/* \n Learn more about your plan\n */}\n\n
\n\n {!isProduction && (\n \n
\n Status
\n\n {loadingContent(userPlan?.currentSubscription.status ?? \"\", isLoadingUserPlan)}\n
\n\n
\n \n {userPlan?.currentSubscription.requestedCancel ? \"Cancel on\" : \"Renew on\"}\n
\n\n {loadingContent(\n userPlan?.currentSubscription.requestedCancel?.scheduledAt\n ? format(new Date(userPlan.currentSubscription.requestedCancel.scheduledAt), \"MMM dd, yyyy\")\n : userPlan?.currentSubscription.endAt\n ? format(new Date(userPlan.currentSubscription.endAt), \"MMM dd, yyyy\")\n : isTrial\n ? format(new Date(userPlan?.trialEndedAt), \"MMM dd, yyyy\")\n : \"\",\n isLoadingUserPlan,\n )}\n
\n\n
\n Price
\n\n {loadingContent(\n `$${\n userPlan?.currentSubscription.billingCycle === BillingCycle.Monthly\n ? userPlan.currentSubscription.monthlyCost\n : userPlan?.currentSubscription.billingCycle === BillingCycle.BiYearly\n ? userPlan.currentSubscription.biYearlyCost\n : userPlan?.currentSubscription.billingCycle === BillingCycle.Yearly\n ? userPlan?.currentSubscription.yearlyCost\n : \"0\"\n }/${userPlan?.currentSubscription.billingCycle}`,\n isLoadingUserPlan,\n )}\n
\n\n
\n Payment
\n\n {loadingContent(\n currentPaymentMethod ? (\n <>\n
\n {currentPaymentMethod?.name}
\n \n ) : (\n \"Free of charge\"\n ),\n isLoadingUserPlan,\n )}\n\n setModal(\"CHANGE_METHOD\")}>Change Payment Method \n setModal(\"BILLING_INFO\")}>Change Billing Info \n
\n )}\n \n When you unsubscribe the{\" \"}\n \n {userPlan?.currentSubscription.subscriptionPackageName}\n \n
\n- \n {userPlan?.currentSubscription.subscriptionPackageId === \"newbie\" ? (\n
- You can not generate images. \n ) : (\n <>\n
- \n Your plan will be reverted to Newbie plan and and use the corresponding utilities.\n \n
- And all members will be changed to Guests. \n
- \n All files uploaded and generated by workspace members will be transferred to Workspace Owner.\n \n
- \n If your current storage capacity exceeds the Newbie plan (\n {parseInt(userPlan?.currentSubscription.cloudStorage ?? \"0\") / 1024 / 1024 / 1024}GB /user), all\n oldest data will be deleted. You have 14 days to backup your data from the time you unsubscribe.\n \n \n )}\n
Are you sure to unsubscribe plan?
{\" \"}\n \n }\n confirmText={\"Unsubscribe\"}\n onClose={() => {\n setModal(null)\n }}\n onConfirm={() => handleUnsubscribe()}\n isLoading={isMutatingUnsubscribe}\n />\n \n )\n}\n\nexport default UserPlan\n","import React from \"react\"\nimport ListBillings from \"./ListBillings\"\nimport UserPlan from \"./UserPlan\"\n\nconst BillingUI = () => {\n return (\n\n
\n )\n}\n\nexport default BillingUI\n","import { MenuSetting } from \"@/constants\"\nimport Info from \"./Info\"\nimport Members from \"./Members\"\nimport Privacy from \"./Privacy\"\nimport Profile from \"./Profile\"\nimport Security from \"./Security\"\nimport { useSetting } from \"./SettingProvider\"\nimport SharedWorkspace from \"./SharedWorkspace\"\nimport PlansUI from \"./Plans\"\nimport BillingUI from \"./Billing\"\n\nconst SettingContent = () => {\n const { currentTab } = useSetting()\n\n return (\n <>\n {currentTab === MenuSetting.about ? (\n \n
\n
\n
\n \n
\n \n
\n Current plan
\n{userPlan?.currentSubscription.subscriptionPackageName}
\n\n
\n Total seat
\n{userPlan?.currentSubscription.seatCount}
\n\n
\n Current subscription
\n\n
\n Monthly
\n${userPlan?.currentSubscription.monthlyCost} /month/seat
\n\n
\n
\n Total
\n${getRenewCost(userPlan?.currentSubscription)}
\n\n
\n
\n Payment method
\nCrypto
\n\n \n Cancel\n \n onConfirm()}>\n Renew\n \n
\n \n By continuing, you agree to GAIA's{\" \"}\n \n terms\n \n
\n\n setIsOpenSidebar(true)}\n >\n
\n \n \n \n
\n Thank you, mate!
\nWe value your feedback
\nFlex to social
\n\n Share your favourite image to social to earn 1 FREE CREDIT each\n time (up to 3 times per image)\n
\n\n\n {links?.map(image => (\n
\n setLink(image.link)} className=\"p-1 cursor-pointer\" key={image.id}>\n
\n ))}\n URL
\n\n
\n Share via
\n\n i.link === link)?.id ?? \"\"}\n urlImageDetails={link}\n />\n
\n \n 
\n
\n \n \n OMG! You love it?
\n Let's go Flex!!!\n
\n 
\n
\n \n \n We're improving
Please stay with us!\n
Help us improve!
\n\n Share your feedback & Earn 1 CREDIT\n
\n \nHave you tried?
\n\n {recipeOptions\n .filter(i =>\n i.value === \"anime\"\n ? userStylesSuccess && userStylesSuccess?.filter(i => i.style === \"anime\").length < 5\n : !userStylesSuccess?.map(s => s.style).includes(i.value),\n )\n .map(i => (\n {\n setSelectedRecipe(i.value)\n if (i.value === \"anime\") {\n setSelectedStyle(\n options.filter(i => !userStylesSuccess?.map(o => o.style).includes(i.value))[0].value,\n )\n }\n }}\n name={i.display}\n value={i.value}\n />\n ))}\n
\n {selectedRecipe === \"anime\" && (\n \n {options\n .filter(i => !userStylesSuccess?.map(o => o.style).includes(i.value))\n .map(i => (\n {\n setSelectedStyle(i.value)\n }}\n >\n
\n ))}\n \n )}\n {i.display}
\n\n {dataFeedback.map(item => (\n handleClickIcon(item.id)}\n className=\"flex-1 flex justify-center cursor-pointer rounded-md p-0.5 hover:bg-[#313131] select-none\"\n >\n 
\n
\n ))}\n \n \n
\n \n {totalCredits} {totalCredits > 1 ? \"CREDITS\" : \"CREDIT\"}\n
\n\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: \"user_info\",\n value: 1,\n })\n\n setIsOpen(!isOpen)\n }}\n className=\"flex items-center justify-between w-full cursor-pointer\"\n >\n
\n \n
\n \n )}\n \n
\n \n
\n {userInfoQuery.data.name}
\n{userInfoQuery.data.email}
\n\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: \"/settings/account\",\n value: 1,\n })\n setReferralModal(true)\n setIsOpen(false)\n }}\n >\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: \"/ai-recipes/view-all\",\n value: 1,\n })\n }}\n href={`/ai-recipes/view-all${referralCode ? `?referralCode=${referralCode}` : \"\"}`}\n rel=\"noopener noreferrer\"\n >\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: \"/terms-of-service\",\n value: 1,\n })\n }}\n href=\"/terms-of-service\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: `mailto:hello@${cdnUrl}`,\n value: 1,\n })\n }}\n href={`mailto:hello@${cdnUrl}`}\n target=\"_blank\"\n className=\"flex items-center p-1 hover:bg-[#313131] w-full rounded-md\"\n rel=\"noopener noreferrer\"\n >\n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: \"logout\",\n value: 1,\n })\n qc.clear()\n logout()\n setIsOpen(false)\n }}\n className=\"text-atherError-200 flex items-center w-full pl-1.5 rounded-md p-1 hover:bg-[#313131]\"\n >\n
\n \n
\n {user && \n
\n\n \n \n
\n \n {menuRecipes\n .filter(item => item.enable)\n .map(item => (\n
\n \n \n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar_alpha\",\n label: \"menu_recipes\",\n params: {\n recipe: item.id,\n recipe_name: item.name,\n },\n })\n setIsOpen(false)\n }}\n >\n {item.name}\n \n
\n ))}\n \n
\n \n {menuRecipes\n .filter(item => item.enable)\n .map(item => (\n
\n \n {\n googleAnalytics.event({\n action: \"click\",\n category: \"navbar\",\n label: \"menu_recipes\",\n params: {\n recipe: item.id,\n recipe_name: item.name,\n },\n })\n }}\n >\n {item.name}\n \n
\n ))}\n \n
\n \n
\n )\n}\n\nexport default Footer\n","import client from \"@/api/client\"\nimport { actionMiddleware } from \"@/queries/middlewares/actionMiddleware\"\nimport { createMutation } from \"react-query-kit\"\nimport { SearchModelTrainingResults } from \"@/api/sdk\"\nimport { InfiniteData } from \"@tanstack/react-query\"\nimport { useWorkspaceModelTrainingInfiniteQuery } from \"./useWorkspaceModelTrainingInfiniteQuery\"\n\nexport const useDeleteModelTrainingMutation = createMutation({\n mutationFn: async ({ ids, deletedAt }: { ids: string[]; deletedAt: string | null }) => {\n if (deletedAt) {\n return await client.api.sdModelTrainingControllerFullyDeleteModels({ trainingIds: ids }).then(res => res.data)\n }\n\n return await client.api.sdModelTrainingControllerSoftDeleteModels({ trainingIds: ids }).then(res => res.data)\n },\n use: [\n actionMiddleware({\n onSuccess: ({ queryClient, variables: { ids, deletedAt } }) => {\n const workspaceModelTrainingsKey = useWorkspaceModelTrainingInfiniteQuery.getKey()\n const workspaceModelTrainingsQueriesDataEntries = queryClient.getQueriesData<\n InfiniteData\n
\n \n \n
\n \n \n
\n \n
\n \n GAIA is a multiplayer SaaS platform designed to revolutionize generative AI production management. GAIA\n enables effortless collaboration of the entire process of creation, storage, organization and tracking.\n
\n\n {socials.map(i => (\n handleGaSocial(i.name, i.url)}\n href={i.url}\n target=\"_blank\"\n >\n {i.name === \"facebook\" ? (\n
\n \n
\n \n \n
\n Copyright © 2023 VIXION Company Limited. All rights reserved
\n\n handleGa(\"terms_of_service\")}\n className=\"underline font-normal text-sm\"\n href={\"/terms-of-service\"}\n target=\"_blank\"\n >\n Terms Of Service\n \n \n handleGa(\"privacy_policy\")}\n className=\"underline font-normal text-sm\"\n href={\"/privacy-policy\"}\n target=\"_blank\"\n >\n Privacy Policy\n \n
\n {`Are you sure to ${\n deletingItem?.deletedAt === \"leave\" ? \"leave\" : \"delete\"\n } this ${renderTypeName(deletingItem?.type)}?`}
\n {!deletingItem?.deletedAt ? (\n deletingItem?.type !== \"task\" &&\n deletingItem?.type !== \"room\" &&\n deletingItem?.type !== \"prompt\" && (\nIt will be moved the Trash and deleted permanently after 30 days.
\n )\n ) : (\n\n It will be {deletingItem?.deletedAt === \"leave\" ? \"leaved\" : \"deleted\"} permanently and cannot be restored.\n
\n )}\n\n \n Cancel\n \n \n Confirm\n \n
\n \n )\n}\n\nexport default DeleteItemModal\n","import { useReferralStore } from \"@/stores\"\nimport IconButton from \"../IconButton\"\nimport Modal from \"../Modal\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { clientUrl } from \"@/constants\"\nimport { useTempState } from \"@/hooks\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { AnimatePresence, motion } from \"framer-motion\"\nimport { FaCopy, FaCheck } from \"react-icons/fa\"\nimport { SocialButtons } from \"../Workspace/SharingModal/AccessLink\"\n\nconst ReferralModal = () => {\n const { user } = useAuth()\n\n const { referralModal, setReferralModal } = useReferralStore()\n const [isCopying, setIsCopying] = useTempState(false, 500)\n const link = `${clientUrl}/ai-recipes?referralCode=${user?.uid}`\n\n const handleCopy = (e: React.MouseEvent\n Invite your friends to join us and earn 5 CREDITS for every successful referral\n
\nReferral link
\n\n \n {!isCopying ? (\n handleCopy(e)}\n >\n \n \n )}\n \n
\n {link}
\n\n
\n Share via
\n\n
\n \n setReferralModal(false)} className=\"px-4 font-semibold\">\n Cancel\n \n
\n \n )\n}\n\nexport default ReferralModal\n","import client from \"@/api/client\"\nimport { ImageSimpleDetail } from \"@/api/sdk\"\nimport IconButton from \"@/components/IconButton\"\nimport LoadingLogo from \"@/components/LoadingLogo\"\nimport Modal from \"@/components/Modal\"\nimport { useAuthenticatedInfinityQuery, useAuthenticatedQuery } from \"@/hooks\"\nimport { useAuth } from \"@/providers/authContext\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport useModalStore from \"@/lib/store\"\nimport { useSignInStore } from \"@/stores\"\nimport { useBeMissUniverseStore } from \"@/stores/useBeMissUniverseStore\"\nimport { useTempTaskStore } from \"@/stores/useTempTaskStore\"\nimport classNames from \"classnames\"\nimport { motion } from \"framer-motion\"\nimport useCustomRouter from \"@/hooks/useCustomRouter\"\nimport { Fragment, useMemo, useRef, useState } from \"react\"\nimport InfiniteScroll from \"react-infinite-scroller\"\nimport SubmitModal from \"../SubmitModal\"\nimport useBeMiss from \"../hooks/useBeMiss\"\nimport { CardBeMissImage } from \"./BeMissUniverseOnlyTaskModal\"\nimport ViewMyVotes from \"./ViewMyVotes\"\n\nconst BeMissUniverseModal = () => {\n const { isOpen, setIsOpen } = useBeMissUniverseStore()\n const { user } = useAuth()\n const take = 10\n const { tempTask } = useTempTaskStore()\n const scrollRef = useRef\n
\n )\n\n if (isError)\n return (\n \n
\n )\n\n if (!mappedHistoryRecipes || !mappedHistoryRecipes.length) {\n return (\n Error
\n\n
\n )\n }\n\n return (\n No image found
\n\n Loading...\n
\n }\n >\n \n
\n )}\n \n Select an image you wish to join the competition
\n\n {renderListVoted()}\n
\n \n \n Later\n \n {\n if (!user) {\n setSignInModal({\n signIn: true,\n })\n return\n }\n\n googleAnalytics.event({\n action: \"click\",\n category: \"be_miss_universe_modal\",\n label: \"join_miss_universe\",\n params: {\n image_id: selected?.id ?? \"\",\n image_name: selected?.name ?? \"\",\n image_owner: selected?.owner.name ?? \"\",\n },\n })\n\n setIsOpenModal(true)\n }}\n className=\"bg-atherPurple-500 hover:bg-atherPurple-500 active:bg-atherPurple-500 text-[#EFE8FD] w-full max-w-[12rem]\"\n >\n {\"Join Miss Universe Contest\"}\n \n
\n \n {!hiddenNav &&
\n {children}
\n {!hiddenFooter && }\n Style name
\n\n setName(e.target.value)}\n />\n {}}\n />\n
\n \n
\n \n Style Images Upload upto 8 images to used as style reference. Use\n square images for best results.\n
\n\n \n
\n \n
\n \n \n \n \n
\n )}\n {images.map((image, idx) => (\n \n
\n \n
\n \n Upload images or Drag & Drop
\n (max 2048px and less than 10MB)\n
\n {\n setSelectedThumbnail(idx)\n }}\n className=\"overflow-hidden flex-shrink-0 h-[10rem] w-full bg-atherGray-950 border-dashed border border-atherGray-700 rounded-lg\"\n url={image.url}\n onDelete={() => handleDeleteImage(idx)}\n preferThumbnail\n />\n \n handleChangeWeight(idx, v)}\n min={0}\n max={1}\n step={0.1}\n marks\n className=\"h-1 horizontal-slider w-full\"\n thumbClassName=\"h-4 w-4 bg-white top-1/2 -translate-y-1/2 rounded-full cursor-pointer\"\n trackClassName=\"h-1 track-slider\"\n renderThumb={(props, _) => (\n
\n \n
\n Low
\nMedium
\nHigh
\n\n
\n )}\n />\n \n {\n setSelectedThumbnail(idx)\n }}\n />\n
\n \n ))}\n \n \n {\n handleCancel()\n }}\n colorScheme=\"secondary\"\n >\n Cancel\n \n \n Create new style\n \n
\n \n )\n}\n\nexport default CreateStyleModal\n","import client from \"@/api/client\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { useLeaveFolderStore } from \"@/stores\"\nimport { useMutation, useQueryClient } from \"@tanstack/react-query\"\nimport useCustomRouter from \"@/hooks/useCustomRouter\"\nimport IconButton from \"../IconButton\"\nimport Modal from \"../Modal\"\n\nconst LeaveFolderModal = () => {\n const qc = useQueryClient()\n const router = useCustomRouter()\n\n const { leaveFolder, setLeaveFolder } = useLeaveFolderStore()\n\n const { mutate: mutateLeaveFolder, isPending: isLoading } = useMutation({\n mutationFn: (id: string) => client.api.folderControllerLeaveFolder(id),\n onSuccess: () => {\n qc.invalidateQueries({ queryKey: [\"folders\"] })\n qc.invalidateQueries({ queryKey: [\"folders-trash\"] })\n setLeaveFolder(null)\n\n if (leaveFolder?.onClose) {\n leaveFolder.onClose()\n\n return\n }\n\n router.push(\"/workspace\")\n },\n })\n\n const handleSubmit = () => {\n if (!leaveFolder) return\n\n googleAnalytics.event({\n action: \"click\",\n category: \"modal\",\n label: `leave_folder_${leaveFolder?.id}`,\n value: 1,\n })\n\n mutateLeaveFolder(leaveFolder.id)\n }\n\n const handleClose = () => {\n setLeaveFolder(null)\n }\n\n return (\n {`Are you sure you want to leave the folder?`}
\nYou will no longer have access to this folder and its files.
\n\n\n \n Cancel\n \n \n Leave The Folder\n \n
\n \n )\n}\n\nexport default LeaveFolderModal\n","import { SubfolderView } from \"@/api/sdk\"\nimport { MyFoldersIcon, SharedWithMeIcon } from \"@/components/shared/icons\"\nimport { cn } from \"@/utils/cn\"\nimport { useEffect, useRef, useState } from \"react\"\n\nexport const tabs = [\n {\n label: \"My folders\",\n icon: \n {tabs.map(tab => (\n onSelectView(tab.view)}\n ref={ref => {\n tabRefs.current[tab.view] = ref as HTMLDivElement\n }}\n >\n \n {tab.icon}\n \n {tab.label}\n
\n ))}\n \n onSelectView(tab!.view)}\n >\n {tab?.label}\n \n onBreadcrumbClick(index)}\n >\n {breadcrumb.name}\n {index !== breadcrumbs.length - 1 && (\n \n onBreadcrumbClick(index)}\n >\n ...\n \n
\n )\n}\n\nexport default Breadcrumbs\n","import { FolderDetail, SubfolderView } from \"@/api/sdk\"\nimport UserCreated from \"@/components/Explore/Gallery/UserCreated\"\nimport IconButton from \"@/components/IconButton\"\nimport Modal from \"@/components/Modal\"\nimport { useAuth } from \"@/providers/authContext\"\nimport {\n useCopyImageToFolderMutation,\n useMoveFolderMutation,\n useMoveImageMutation,\n useRootFolderQuery,\n useSubFoldersInfiniteQuery,\n} from \"@/queries\"\nimport { useCreateFolderV2Store, useMoveItemV2Store } from \"@/stores\"\nimport { capitalize } from \"@/utils\"\nimport { cn } from \"@/utils/cn\"\nimport { AnimatePresence, motion } from \"framer-motion\"\nimport Image from \"next/image\"\nimport { useRef, useState } from \"react\"\nimport InfiniteScroll from \"react-infinite-scroller\"\nimport LoadingIcon from \"../../LoadingIcon\"\nimport { SharpChevronRightIcon } from \"../../shared/icons\"\nimport Breadcrumbs from \"./Breadcrumbs\"\nimport FolderTabs from \"./FolderTabs\"\nimport FolderIcon from \"@/components/Workspace/Folder/FolderIcon\"\n\nconst MoveItemModalV2 = () => {\n const { movingItem, setMovingItem } = useMoveItemV2Store()\n const { setParentFolder } = useCreateFolderV2Store()\n const { user } = useAuth()\n\n const title =\n movingItem?.type === \"folder\" ? `${movingItem?.action ?? \"Move\"} Folder` : `${movingItem?.action ?? \"Move\"} Image`\n\n const [selectedView, setSelectedView] = useState\n \n
\n \n\n \n
\n \n \n \n scrollRef.current!}\n loadMore={() => fetchNextPage()}\n hasMore={!isFetching && hasNextPage}\n useWindow={false}\n threshold={250}\n className=\"flex-col flex\"\n >\n
\n \n \n \n \n {filteredData.length > 0 ? (\n filteredData.map(folder => (\n handleSelectDestinationFolder(folder)}\n onDoubleClick={() => handleSelectFolder(folder)}\n >\n {\n e.stopPropagation()\n handleSelectFolder(folder)\n }}\n >\n
\n ))\n ) : isLoading ? (\n \n
\n \n
\n \n {folder.name}\n
\n {user?.uid !== folder.creator?.uid && (\n\n
\n ) : error ? (\n \n
\n ) : (\n Fetch folders failed. Try again later
\n\n
\n )}\n No folders
\n\n
\n \n {canCreateNewFolder && (\n {\n setParentFolder({ id: selectedOrRootFolder!.id })\n }}\n >\n Create new\n \n )}\n
\n \n \n Cancel\n \n \n {movingItem?.action ?? \"Move\"}\n \n
\n {`Are you sure to recover this ${recoverItem?.type}?`}
\n\n \n Cancel\n \n \n Confirm\n \n
\n \n )\n}\n\nexport default RecoverItemModal\n","import { useRenameFolderMutation, useUpdateTaskMutation, useUpdateWildcardMutation } from \"@/queries\"\nimport { useRenameStyleMutation } from \"@/queries/tools/style/useUpdateStyleMutation\"\nimport { useRenameItemStore } from \"@/stores\"\nimport React, { useEffect, useRef, useState } from \"react\"\nimport IconButton from \"../IconButton\"\nimport Input from \"../Input\"\nimport Modal from \"../Modal\"\nimport { useRenameComfyUiWorkflowMutation } from \"@/queries/tools/comfyui-recipe/updateComfyUiRecipeMutations\"\nimport { useToast } from \"@/hooks\"\n\nconst RenameModal = () => {\n const { renamingItem, setRenamingItem } = useRenameItemStore()\n const toast = useToast()\n\n const [input, setInput] = useState(\"\")\n const [error, setError] = useState(\"\")\n const inputRef = useRef\n \n
\n )}\n \n
\n \n {!hiddenSidebar &&
\n \n {!hiddenNavbar && (\n
\n\n \n {children}\n {!hiddenNavigation && (\n <>\n
\n \n
\n \n \n
\n \n {!hiddenMenu && (\n \n
\n )}\n\n {children}\n \n {tipsAndTricksFolder.map((item, index) => (\n {\n if (width <= 1024) setIsOpenSidebar(false)\n }}\n target={item.id.includes(\"promptbook\") ? \"_blank\" : \"_self\"}\n className={classNames(\"flex items-center justify-between py-2 px-4 rounded-2xl font-semibold\", {\n \"bg-atherGray-850\": item.path === router.pathname,\n \"text-atherGray-300\": item.path !== router.pathname,\n })}\n >\n {item.name}\n
\n \n {item.id.includes(\"promptbook\") ? (\n
\n \n ))}\n \n {!hiddenNavbar && (\n
\n\n \n {children}\n {!hiddenNavigation && (\n <>\n
\n 
\n \n 
\n \n 
\n \n \n {item}\n
\n ))\n ) : (\n\n Share your image to social to earn 1 FREE CREDIT each time (upto 3\n times per image)\n
\n )}\nURL
\n\n \n
\n \n Share via
\n\n
\n Preview
\n\n 
\n
\n \n \n Close\n \n
\n \n )\n}\n\nexport default SharePublicModal\n","import { ClipboardEvent, createRef, RefObject, useEffect, useRef, useState } from \"react\"\nimport classNames from \"classnames\"\nimport { twMerge } from \"tailwind-merge\"\n\ninterface PasscodeInputProps {\n length?: number\n onBlur?: () => void\n value?: string\n onChange?: (value: string) => void\n haveError?: boolean\n className?: string\n}\n\nconst PasscodeInput = ({ length = 6, value, onBlur, onChange, haveError, className }: PasscodeInputProps) => {\n const arrayFromLength = Array.from(Array(length).keys())\n const passcodeRef = useRef\n
\n )\n}\n\nexport default PasscodeInput\n","import { ShareByWorkspaceMode, SharingRole } from \"@/api/sdk\"\nimport { ArrowDownIcon, GlobalIcon, LockIcon } from \"@/components/shared/icons\"\nimport { googleAnalytics } from \"@/lib/gtag\"\nimport { cn } from \"@/utils/cn\"\nimport classNames from \"classnames\"\nimport React, { Fragment, useState } from \"react\"\nimport { FacebookShareButton, LinkedinShareButton, TwitterShareButton } from \"react-share\"\nimport { cdnPublicFolderUrl } from \"@/constants\"\nimport Popover from \"@/components/Popover\"\n\nexport const SocialButtons = ({ urlImageDetails }: { urlImageDetails: string }) => {\n const handleSocialEvent = (social: string) => {\n googleAnalytics.event({\n action: \"click\",\n category: \"modal\",\n label: `share_${social}_${urlImageDetails}`,\n value: 1,\n })\n }\n\n return (\n handlePaste(e)}>\n {arrayFromLength.map((_, index) => (\n {\n setTimeout(() => {\n if (focusedInputIndexRef.current === index) {\n focusedInputIndexRef.current = null\n setFocusedInput(null)\n }\n }, 100)\n }}\n onFocus={() => {\n focusedInputIndexRef.current = index\n setFocusedInput(index)\n }}\n onChange={e => handleInputChange(e.target, index)}\n onKeyDown={e => {\n // focus next input when enter the same key\n if (e.key === e.currentTarget.value) {\n e.preventDefault()\n focusNextRef(index)\n return\n }\n if (e.key === \"Backspace\") {\n if (e.currentTarget.value === \"\") {\n e.preventDefault()\n focusPreviousRef(index)\n } else {\n ;(e.target as any)?.value || focusPreviousRef(index)\n }\n }\n\n if (e.key === \"ArrowLeft\") {\n handleMoveFocus(Math.max(0, index - 1))\n if (Math.max(0, index - 1) < index) {\n e.preventDefault()\n focusPreviousRef(index)\n }\n }\n\n if (e.key === \"ArrowRight\") {\n handleMoveFocus(Math.min(length - 1, index + 1))\n if (Math.min(length - 1, index + 1) > index) {\n e.preventDefault()\n focusNextRef(index)\n }\n }\n }}\n />\n ))}\n
\n 
\n 
\n \n \n General permission:
\n\n \n {workspaceRole}\n \n \n {workspaceRole}\n \n ))}\n
\n \n )\n}\n\nexport default AccessLink\n","import { ChatRoomRole, ImageOwner, ResourceRole, SharingRole } from \"@/api/sdk\"\nimport UserBadge from \"@/components/UserBadge\"\nimport { ArrowDownIcon } from \"@/components/shared/icons\"\nimport { cn } from \"@/utils/cn\"\nimport { useState } from \"react\"\nimport { FullRoleType } from \"./ListUserShare\"\nimport Popover from \"@/components/Popover\"\n\nexport interface ShareUserItemProps {\n user: ImageOwner & { role?: FullRoleType | null; isGuest?: boolean }\n onClick?: () => void\n className?: string\n onUnshare?: () => void\n canShare: boolean\n availableRoles?: {\n label: string\n value: FullRoleType\n }[]\n onUpdateRole?: (role: FullRoleType) => void\n}\n\nconst ShareUserItem = ({\n user,\n onClick,\n className,\n onUnshare,\n canShare,\n availableRoles,\n onUpdateRole,\n}: ShareUserItemProps) => {\n const [isOpen, setIsOpen] = useState(false)\n\n const renderRoleMenu = () => {\n if (user.role === \"owner\") {\n return (\n \n
\n {workspaceRole &&\n (canShare ? (\n \n {value !== \"restricted\" ?
\n \n {canShare ? (\n \n
\n {value}
\n \n\n {\n if (value === ShareByWorkspaceMode.Restricted) return\n onSharingModeChange(ShareByWorkspaceMode.Restricted)\n }}\n >\n Restricted\n \n {\n if (value === ShareByWorkspaceMode.Workspace) return\n onSharingModeChange(ShareByWorkspaceMode.Workspace)\n }}\n >\n Everyone in the workspace\n \n
\n \n ) : (\n \n
{value}
\n \n )}\n\n{description}
\n\n {workspaceRoleOptions?.map(r => (\n {\n e.stopPropagation()\n onWorkspaceRoleChange && onWorkspaceRoleChange(r.value as SharingRole)\n setIsOpenRole(false)\n }}\n className={cn(\n \"group hover:bg-atherGray-850 rounded-2xl text-left px-4 py-2 text-atherGray-0 w-full\",\n {\n \"bg-atherGray-850\": r.value === workspaceRole,\n },\n )}\n >\n \n {r.label}\n \n \n ))}\n
\n \n ) : (\n \n
\n )\n }\n\n if (canShare) {\n return (\n Owner
\n\n {!user.isGuest &&\n availableRoles?.map(role => (\n {\n e.stopPropagation()\n\n onUpdateRole?.(role.value as SharingRole)\n setIsOpen(false)\n }}\n className={cn(\n \"group hover:bg-atherGray-850 text-left rounded-2xl px-4 py-1.5 text-atherGray-0 w-full\",\n {\n \"bg-atherGray-850\": role.value === user.role,\n },\n )}\n >\n \n {role.label}\n \n \n ))}\n {!user.isGuest &&
}\n
\n \n )\n }\n\n return (\n }\n
\n {\n e.stopPropagation()\n onUnshare?.()\n setIsOpen(false)\n }}\n className={\n \"flex items-center hover:bg-atherGray-850 bg-transparent rounded-2xl px-4 py-1.5 pr-8 w-full text-red-500 text-sm\"\n }\n >\n
\n Remove access
\n \n\n
\n )\n }\n\n return (\n {user.role}
\n\n
\n {renderRoleMenu()}\n \n )\n}\n\nexport default ShareUserItem\n","export const socials = [\n {\n name: \"facebook\",\n url: \"https://www.facebook.com/beginGAIA\",\n },\n {\n name: \"instagram\",\n url: \"https://www.instagram.com/begingaia\",\n },\n {\n name: \"youtube\",\n url: \"https://www.youtube.com/@protogaia\",\n },\n {\n name: \"twitter\",\n url: \"https://x.com/beginGAIA\",\n },\n // {\n // name: \"reddit\",\n // url: \"https://www.reddit.com/user/protogaia\",\n // },\n {\n name: \"linkedin\",\n url: \"https://www.linkedin.com/company/protogaia\",\n },\n // {\n // name: \"tiktok\",\n // url: \"http://tiktok.com/@ArtVentureX\",\n // },\n]\n","import { useEffect } from \"react\"\n\nconst useScript = (url, isAsync = true) => {\n useEffect(() => {\n const script = document.createElement(\"script\")\n\n script.src = url\n script.async = isAsync\n\n document.body.appendChild(script)\n\n return () => {\n document.body.removeChild(script)\n }\n }, [url, isAsync])\n}\n\nexport default useScript\n","// SafeAreaView.tsx\nimport React from \"react\"\n\ninterface SafeAreaViewProps {\n children: React.ReactNode\n style?: React.CSSProperties\n className?: string\n as?: React.ElementType\n id?: string\n}\n\nconst SafeAreaView: React.FC