rollback phosphor icons

next.config.js

@@ -90,7 +90,6 @@ const nextConfig = {
   },
   experimental: {
     scrollRestoration: true,
-    optimizePackageImports: ["@phosphor-icons/react"],
   },
   async rewrites() {
     return {

package.json

@@ -42,7 +42,6 @@
     "@lexical/selection": "^0.12.0",
     "@lexical/utils": "^0.12.0",
     "@nouns/assets": "^0.4.2",
-    "@phosphor-icons/react": "^2.1.7",
     "@snyk/protect": "latest",
     "@t3-oss/env-nextjs": "^0.10.1",
     "@tanstack/react-query": "^5.26.3",
@@ -69,6 +68,7 @@
     "mini-svg-data-uri": "^1.4.4",
     "next": "14.0.1",
     "papaparse": "^5.4.1",
+    "phosphor-react": "^1.4.1",
     "posthog-js": "^1.139.3",
     "qrcode.react": "^3.1.0",
     "randombytes": "^2.1.0",

src/components/[guild]/AccessHub/AccessHub.tsx

@@ -7,11 +7,11 @@ import {
   SimpleGrid,
   Stack,
 } from "@chakra-ui/react"
-import { StarHalf } from "@phosphor-icons/react"
 import Card from "components/common/Card"
 import ClientOnly from "components/common/ClientOnly"
 import useMembership from "components/explorer/hooks/useMembership"
 import dynamic from "next/dynamic"
+import { StarHalf } from "phosphor-react"
 import PointsRewardCard from "rewards/Points/PointsRewardCard"
 import { TokenRewardCard } from "rewards/Token/TokenRewardCard"
 import { PlatformType } from "types"

src/components/[guild]/AccessHub/components/CampaignCards/CampaignCards.tsx

@@ -6,7 +6,6 @@ import {
   Text,
   useColorModeValue,
 } from "@chakra-ui/react"
-import { ArrowRight, Plus } from "@phosphor-icons/react"
 import useGuild from "components/[guild]/hooks/useGuild"
 import useGuildPermission from "components/[guild]/hooks/useGuildPermission"
 import Button from "components/common/Button"
@@ -16,6 +15,7 @@ import dynamic from "next/dynamic"
 import Image from "next/image"
 import Link from "next/link"
 import { useRouter } from "next/router"
+import { ArrowRight, Plus } from "phosphor-react"
 
 const DynamicCampaignCardMenu = dynamic(
   () => import("./components/CampaignCardMenu")

src/components/[guild]/AccessHub/components/CampaignCards/components/CampaignCardMenu.tsx

@@ -9,10 +9,10 @@ import {
   useColorModeValue,
   useDisclosure,
 } from "@chakra-ui/react"
-import { PencilSimple, TrashSimple } from "@phosphor-icons/react"
 import PlatformCardMenu from "components/[guild]/RolePlatforms/components/PlatformCard/components/PlatformCardMenu"
 import Button from "components/common/Button"
 import { Alert } from "components/common/Modal"
+import { PencilSimple, TrashSimple } from "phosphor-react"
 import { useRef } from "react"
 import useDeleteRoleGroup from "../hooks/useDeleteRoleGroup"
 import EditCampaignModal from "./EditCampaignModal"

src/components/[guild]/AccessHub/components/EditRewardAvailabilityMenuItem.tsx

@@ -1,8 +1,8 @@
 import { MenuItem, useDisclosure } from "@chakra-ui/react"
-import { Clock } from "@phosphor-icons/react"
 import EditRewardAvailabilityModal from "components/[guild]/RolePlatforms/components/EditRewardAvailabilityModal"
 import useGuild from "components/[guild]/hooks/useGuild"
 import useToast from "hooks/useToast"
+import { Clock } from "phosphor-react"
 import { PlatformName, PlatformType } from "types"
 import useEditRolePlatform from "../hooks/useEditRolePlatform"
 

src/components/[guild]/AccessHub/components/GuildPinRewardCard.tsx

@@ -1,10 +1,10 @@
 import { Icon, Tooltip, useColorModeValue } from "@chakra-ui/react"
-import { CircleWavyCheck, Question } from "@phosphor-icons/react"
 import { useMintGuildPinContext } from "components/[guild]/Requirements/components/GuildCheckout/MintGuildPinContext"
 import useGuild from "components/[guild]/hooks/useGuild"
 import useGuildPermission from "components/[guild]/hooks/useGuildPermission"
 import RewardCard from "components/common/RewardCard"
 import dynamic from "next/dynamic"
+import { CircleWavyCheck, Question } from "phosphor-react"
 
 const DynamicMintGuildPin = dynamic(
   () =>

src/components/[guild]/AccessHub/components/PlatformAccessButton.tsx

@@ -1,6 +1,6 @@
 import { Icon } from "@chakra-ui/react"
-import { ArrowSquareOut } from "@phosphor-icons/react"
 import Button from "components/common/Button"
+import { ArrowSquareOut } from "phosphor-react"
 import rewards from "rewards"
 import { GuildPlatform, PlatformType } from "types"
 import usePlatformAccessButton from "./usePlatformAccessButton"

src/components/[guild]/AccessHub/components/RemovePlatformMenuItem.tsx

@@ -1,9 +1,9 @@
 import { MenuItem, useColorModeValue, useDisclosure } from "@chakra-ui/react"
-import { TrashSimple } from "@phosphor-icons/react"
 import useRemoveGuildPlatform from "components/[guild]/AccessHub/hooks/useRemoveGuildPlatform"
 import { AlreadyGrantedAccessesWillRemainInfo } from "components/[guild]/RolePlatforms/components/RemovePlatformButton/RemovePlatformButton"
 import useGuild from "components/[guild]/hooks/useGuild"
 import ConfirmationAlert from "components/create-guild/Requirements/components/ConfirmationAlert"
+import { TrashSimple } from "phosphor-react"
 import rewards from "rewards"
 import { PlatformType } from "types"
 

src/components/[guild]/AddAndOrderRoles/AddAndOrderRoles.tsx

@@ -9,9 +9,9 @@ import {
   MenuList,
   useDisclosure,
 } from "@chakra-ui/react"
-import { CaretDown, ListNumbers, Plus } from "@phosphor-icons/react"
 import Button from "components/common/Button"
 import useIsStuck from "hooks/useIsStuck"
+import { CaretDown, ListNumbers, Plus } from "phosphor-react"
 import { useEffect, useRef } from "react"
 import RecheckAccessesButton from "../RecheckAccessesButton"
 import AddRoleDrawer from "./components/AddRoleDrawer"

src/components/[guild]/AddAndOrderRoles/components/DraggableRoleCard.tsx

@@ -1,9 +1,9 @@
 import { HStack, Heading, Icon, Spacer } from "@chakra-ui/react"
-import { DotsSixVertical } from "@phosphor-icons/react"
 import MemberCount from "components/[guild]/RoleCard/components/MemberCount"
 import Visibility from "components/[guild]/Visibility"
 import Card from "components/common/Card"
 import GuildLogo from "components/common/GuildLogo"
+import { DotsSixVertical } from "phosphor-react"
 import { Role } from "types"
 
 type Props = {

src/components/[guild]/AddRewardAndCampaign.tsx

@@ -12,8 +12,8 @@ import {
   Text,
   useDisclosure,
 } from "@chakra-ui/react"
-import { CaretDown, Plus } from "@phosphor-icons/react"
 import CreateCampaignModal from "components/[guild]/CreateCampaignModal"
+import { CaretDown, Plus } from "phosphor-react"
 import AddSolutionsButton from "solutions/components/AddSolutionsButton"
 import { useIsTabsStuck } from "./Tabs"
 import { useThemeContext } from "./ThemeContext"

src/components/[guild]/AddRewardButton/AddRewardButton.tsx

@@ -1,11 +1,11 @@
 import { ModalOverlay, useDisclosure } from "@chakra-ui/react"
 import { Schemas, Visibility } from "@guildxyz/types"
-import { Plus } from "@phosphor-icons/react"
 import Button from "components/common/Button"
 import DiscardAlert from "components/common/DiscardAlert"
 import { Modal } from "components/common/Modal"
 import useShowErrorToast from "hooks/useShowErrorToast"
 import { atom, useAtomValue } from "jotai"
+import { Plus } from "phosphor-react"
 import { FormProvider, useForm, useWatch } from "react-hook-form"
 import { modalSizeForPlatform } from "rewards"
 import rewardComponents from "rewards/components"

src/components/[guild]/AddRewardButton/SelectRolePanel.tsx

@@ -12,12 +12,12 @@ import {
   useColorModeValue,
 } from "@chakra-ui/react"
 import { Visibility } from "@guildxyz/types"
-import { ArrowLeft, Info } from "@phosphor-icons/react"
 import { usePostHogContext } from "components/_app/PostHogProvider"
 import Button from "components/common/Button"
 import useJsConfetti from "components/create-guild/hooks/useJsConfetti"
 import useCreateRRR, { SubmitData } from "hooks/useCreateRRR"
 import useToast from "hooks/useToast"
+import { ArrowLeft, Info } from "phosphor-react"
 import { useState } from "react"
 import { useFormContext, useWatch } from "react-hook-form"
 import rewards, { CAPACITY_TIME_PLATFORMS } from "rewards"

src/components/[guild]/CollapsibleRoleSection.tsx

@@ -1,6 +1,6 @@
 import { Box, Button, Collapse, Icon, Stack, useDisclosure } from "@chakra-ui/react"
 
-import { CaretDown } from "@phosphor-icons/react"
+import { CaretDown } from "phosphor-react"
 import capitalize from "utils/capitalize"
 
 const CollapsibleRoleSection = ({

src/components/[guild]/CreateCampaignModal/CreateCampaignModal.tsx

@@ -6,11 +6,11 @@ import {
   ModalHeader,
   ModalOverlay,
 } from "@chakra-ui/react"
-import { ArrowRight } from "@phosphor-icons/react"
 import Button from "components/common/Button"
 import { Modal } from "components/common/Modal"
 import usePinata from "hooks/usePinata"
 import useSubmitWithUpload from "hooks/useSubmitWithUpload"
+import { ArrowRight } from "phosphor-react"
 import { FormProvider, useForm } from "react-hook-form"
 import CampaignForm, { CampaignFormType } from "./components/CampaignForm"
 import useCreateRoleGroup from "./hooks/useCreateRoleGroup"

src/components/[guild]/CreateFormModal/components/FormCardEditable/FormCardEditable.tsx

@@ -14,14 +14,14 @@ import {
   Tooltip,
 } from "@chakra-ui/react"
 import { Schemas } from "@guildxyz/types"
-import { DotsSixVertical, PencilSimple, Trash } from "@phosphor-icons/react"
 import { CreateForm } from "components/[guild]/RolePlatforms/components/AddRoleRewardModal/components/AddFormPanel"
 import Button from "components/common/Button"
 import Card from "components/common/Card"
 import CardMotionWrapper from "components/common/CardMotionWrapper"
 import ControlledSelect from "components/common/ControlledSelect"
 import FormErrorMessage from "components/common/FormErrorMessage"
 import { Reorder, useDragControls } from "framer-motion"
+import { DotsSixVertical, PencilSimple, Trash } from "phosphor-react"
 import { useState } from "react"
 import { useController, useFormContext, useWatch } from "react-hook-form"
 import { SelectOption } from "types"

src/components/[guild]/CreateFormModal/components/Setup/OptionLayout.tsx

@@ -7,8 +7,8 @@ import {
   Icon,
   useColorModeValue,
 } from "@chakra-ui/react"
-import { DotsSixVertical } from "@phosphor-icons/react"
 import { Reorder, useDragControls } from "framer-motion"
+import { DotsSixVertical } from "phosphor-react"
 import { PropsWithChildren, ReactNode } from "react"
 import { Rest } from "types"
 

src/components/[guild]/CreateFormModal/components/Setup/RemoveButton.tsx

@@ -1,5 +1,5 @@
 import { IconButton, IconButtonProps } from "@chakra-ui/react"
-import { X } from "@phosphor-icons/react"
+import { X } from "phosphor-react"
 
 const RemoveButton = (
   props: Omit<

src/components/[guild]/CreateFormModal/formConfig.tsx

@@ -1,12 +1,12 @@
 import { Schemas } from "@guildxyz/types"
+import OptionIcon from "components/common/StyledSelect/components/CustomSelectOption/components/OptionIcon"
 import {
   CheckSquare,
   NumberCircleFive,
   NumberSquareFive,
   RadioButton,
   Textbox,
-} from "@phosphor-icons/react"
-import OptionIcon from "components/common/StyledSelect/components/CustomSelectOption/components/OptionIcon"
+} from "phosphor-react"
 import { ComponentType, ReactNode } from "react"
 import {
   ExpectedFieldDataProps,

src/components/[guild]/DeleteButton.tsx

@@ -1,5 +1,5 @@
 import { ButtonProps, Icon, IconButton, Tooltip } from "@chakra-ui/react"
-import { Trash } from "@phosphor-icons/react"
+import { Trash } from "phosphor-react"
 import { PropsWithChildren } from "react"
 
 type Props = {

src/components/[guild]/DiscordBotPermissionsChecker.tsx

@@ -11,12 +11,12 @@ import {
   UnorderedList,
   useDisclosure,
 } from "@chakra-ui/react"
-import { ArrowSquareOut, Info } from "@phosphor-icons/react"
 import Button from "components/common/Button"
 import DiscordRoleVideo from "components/common/DiscordRoleVideo"
 import { Modal } from "components/common/Modal"
 import { env } from "env"
 import { ActionToastOptions, useToastWithButton } from "hooks/useToast"
+import { ArrowSquareOut, Info } from "phosphor-react"
 import { useMemo, useRef, useState } from "react"
 import useSWRImmutable from "swr/immutable"
 import { PlatformType } from "types"

src/components/[guild]/EditGuild/EditGuildButton.tsx

@@ -1,5 +1,5 @@
 import { IconButton } from "@chakra-ui/react"
-import { GearSix } from "@phosphor-icons/react"
+import { GearSix } from "phosphor-react"
 import { useThemeContext } from "../ThemeContext"
 import { useEditGuildDrawer } from "./EditGuildDrawerContext"
 

src/components/[guild]/EditGuild/components/Admins/components/AdminSelect.tsx

@@ -1,5 +1,4 @@
 import { HStack, Icon, forwardRef } from "@chakra-ui/react"
-import { Warning } from "@phosphor-icons/react"
 import {
   CreatableSelect,
   GroupBase,
@@ -10,6 +9,7 @@ import {
 import CopyableAddress from "components/common/CopyableAddress"
 import StyledSelect from "components/common/StyledSelect"
 import CustomMenuList from "components/common/StyledSelect/components/CustomMenuList"
+import { Warning } from "phosphor-react"
 import { PropsWithChildren, useEffect } from "react"
 import { useFormContext, useWatch } from "react-hook-form"
 import { useEnsAddress } from "wagmi"

src/components/[guild]/EditGuild/components/BackgroundImageUploader.tsx

@@ -1,10 +1,10 @@
 import { FormControl, FormLabel, Progress, Wrap } from "@chakra-ui/react"
-import { File } from "@phosphor-icons/react"
 import { useThemeContext } from "components/[guild]/ThemeContext"
 import Button from "components/common/Button"
 import FormErrorMessage from "components/common/FormErrorMessage"
 import useDropzone, { ERROR_MESSAGES } from "hooks/useDropzone"
 import { Uploader } from "hooks/usePinata/usePinata"
+import { File } from "phosphor-react"
 import { useState } from "react"
 import RemoveBackgroundImage from "./RemoveBackgroundImage"
 

src/components/[guild]/EditGuild/components/ColorPicker.tsx

@@ -8,11 +8,11 @@ import {
   VStack,
   useColorModeValue,
 } from "@chakra-ui/react"
-import { Palette } from "@phosphor-icons/react"
 import Color from "color"
 import { useThemeContext } from "components/[guild]/ThemeContext"
 import FormErrorMessage from "components/common/FormErrorMessage"
 import useDebouncedState from "hooks/useDebouncedState"
+import { Palette } from "phosphor-react"
 import { useEffect, useState } from "react"
 import { Controller, useFormContext, useWatch } from "react-hook-form"
 

src/components/[guild]/EditGuild/components/Events/Events.tsx

@@ -1,6 +1,6 @@
 import { Icon, Img, SimpleGrid, Text } from "@chakra-ui/react"
-import { Plus } from "@phosphor-icons/react"
 import StyledSelect from "components/common/StyledSelect"
+import { Plus } from "phosphor-react"
 import { useFormContext, useWatch } from "react-hook-form"
 import { EventSourcesKey, SelectOption } from "types"
 import EventInput, { eventSourceNames, logos } from "./EventInput"

src/components/[guild]/EditGuild/components/RemoveBackgroundImage.tsx

@@ -1,7 +1,7 @@
 import { Icon } from "@chakra-ui/react"
-import { X } from "@phosphor-icons/react"
 import { useThemeContext } from "components/[guild]/ThemeContext"
 import Button from "components/common/Button"
+import { X } from "phosphor-react"
 import { useFormContext } from "react-hook-form"
 
 const RemoveBackgroundImage = () => {

src/components/[guild]/EditGuild/components/SocialLinks.tsx

@@ -10,10 +10,10 @@ import {
   SimpleGrid,
 } from "@chakra-ui/react"
 import { SocialLinks as SocialLinksType } from "@guildxyz/types"
-import { Plus } from "@phosphor-icons/react"
 import SocialIcon from "components/[guild]/SocialIcon"
 import FormErrorMessage from "components/common/FormErrorMessage"
 import StyledSelect from "components/common/StyledSelect"
+import { Plus } from "phosphor-react"
 import { useFormContext, useWatch } from "react-hook-form"
 import { SelectOption, SocialLinkKey, supportedSocialLinks } from "types"
 import capitalize from "utils/capitalize"

src/components/[guild]/Events/EventCard/components/EventInfo.tsx

@@ -1,5 +1,5 @@
 import { HStack, StackProps, Tag, TagLabel, TagLeftIcon } from "@chakra-ui/react"
-import { Clock, Users } from "@phosphor-icons/react"
+import { Clock, Users } from "phosphor-react"
 
 type Props = {
   startDate: number

src/components/[guild]/Events/EventCard/components/JoinEventButton.tsx

@@ -1,8 +1,8 @@
 import { ButtonProps } from "@chakra-ui/react"
-import { ArrowSquareOut } from "@phosphor-icons/react"
 import { usePostHogContext } from "components/_app/PostHogProvider"
 import Button from "components/common/Button"
 import useColorPalette from "hooks/useColorPalette"
+import { ArrowSquareOut } from "phosphor-react"
 import { EventSourcesKey } from "types"
 
 type Props = {