chore: clean up unused code (#241)

* chore: format & remove unused code

* chore: remove unused dependencies

* cleanup BaseWidget

* fix: remove unnecessary check in standalone

.vscode/settings.json

@@ -2,7 +2,7 @@
 	"editor.formatOnSave": true,
 
 	"editor.codeActionsOnSave": {
-		"source.fixAll": true
+		"source.fixAll": "explicit"
 	},
 
 	"[typescriptreact]": {

cspell.json

@@ -3,10 +3,23 @@
 	"enabled": true,
 	"language": "en-US",
 	"allowCompoundWords": true,
-	"dictionaries": ["typescript", "node", "npm", "html"],
-	"enabledLanguageIds": ["typescript", "typescriptreact", "javascript", "markdown", "yaml", "json"],
+	"dictionaries": [
+		"typescript",
+		"node",
+		"npm",
+		"html"
+	],
+	"enabledLanguageIds": [
+		"typescript",
+		"typescriptreact",
+		"javascript",
+		"markdown",
+		"yaml",
+		"json"
+	],
 	"words": [
 		"arrayify",
+		"consts",
 		"dfea",
 		"eafc",
 		"esbuild",
@@ -18,11 +31,11 @@
 		"merkle",
 		"NextJS",
 		"QRCode",
+		"tsup",
 		"TTFB",
 		"viem",
 		"webp",
-		"zustand",
 		"worldid",
-		"consts"
+		"zustand"
 	]
 }

packages/react/package.json

@@ -60,15 +60,12 @@
 		"react-dom": ">18.0.0"
 	},
 	"dependencies": {
-		"@fontsource/rubik": "^4.5.11",
-		"@headlessui/react": "^1.7.4",
 		"@radix-ui/react-dialog": "^1.0.3",
 		"@radix-ui/react-toast": "^1.1.3",
 		"@tailwindcss/forms": "^0.5.3",
 		"@worldcoin/idkit-core": "workspace:*",
 		"copy-to-clipboard": "^3.3.3",
 		"framer-motion": "^7.6.7",
-		"posthog-js-lite": "2.4.0",
 		"qrcode": "^1.5.1",
 		"react-shadow": "^19.1.0",
 		"zustand": "^4.5"

packages/react/src/components/IDKitWidget/BaseWidget.tsx

@@ -3,7 +3,6 @@ import type { FC } from 'react'
 import root from 'react-shadow'
 import { IDKITStage } from '@/types'
 import useMedia from '@/hooks/useMedia'
-import { classNames } from '@/lib/utils'
 import Styles from '@/components/Styles'
 import useIDKitStore from '@/store/idkit'
 import { shallow } from 'zustand/shallow'
@@ -12,31 +11,28 @@ import ErrorState from './States/ErrorState'
 import { ConfigSource } from '@/types/config'
 import * as Toast from '@radix-ui/react-toast'
 import type { IDKitStore } from '@/store/idkit'
-import PrivacyState from './States/PrivacyState'
 import SuccessState from './States/SuccessState'
 import WorldIDState from './States/WorldIDState'
 import * as Dialog from '@radix-ui/react-dialog'
 import type { WidgetProps } from '@/types/config'
 import WorldcoinIcon from '../Icons/WorldcoinIcon'
 import { Fragment, useEffect, useMemo } from 'react'
 import { AnimatePresence, motion } from 'framer-motion'
-import ArrowLongLeftIcon from '../Icons/ArrowLongLeftIcon'
 import HostAppVerificationState from './States/HostAppVerificationState'
 
-const getParams = ({ open, processing, onOpenChange, stage, setStage, computed, setOptions }: IDKitStore) => ({
+const getParams = ({ open, processing, onOpenChange, stage, setStage, setOptions }: IDKitStore) => ({
 	stage,
 	setStage,
 	processing,
 	setOptions,
 	isOpen: open,
 	onOpenChange,
-	canGoBack: computed.canGoBack(stage),
 })
 
 const IDKitWidget: FC<WidgetProps> = ({ children, ...config }) => {
 	const media = useMedia()
 
-	const { isOpen, onOpenChange, stage, setStage, canGoBack, setOptions } = useIDKitStore(getParams, shallow)
+	const { isOpen, onOpenChange, stage, setOptions } = useIDKitStore(getParams, shallow)
 
 	useEffect(() => {
 		setOptions(config, ConfigSource.PROPS)
@@ -50,8 +46,6 @@ const IDKitWidget: FC<WidgetProps> = ({ children, ...config }) => {
 				return SuccessState
 			case IDKITStage.ERROR:
 				return ErrorState
-			case IDKITStage.PRIVACY:
-				return PrivacyState
 			case IDKITStage.HOST_APP_VERIFICATION:
 				return HostAppVerificationState
 			default:
@@ -99,17 +93,6 @@ const IDKitWidget: FC<WidgetProps> = ({ children, ...config }) => {
 													<Toast.Provider>
 														<Toast.Viewport className="flex justify-center" />
 														<div className="mx-6 mb-12 flex items-center justify-between">
-															<button
-																onClick={() => setStage(IDKITStage.WORLD_ID)}
-																disabled={!canGoBack}
-																className={classNames(
-																	!canGoBack && 'invisible pointer-events-none',
-																	'dark:bg-d3dfea/15 flex h-8 w-8 items-center justify-center rounded-full bg-gray-100 dark:text-white'
-																)}
-															>
-																<ArrowLongLeftIcon className="w-4" />
-															</button>
-
 															<Dialog.Close className="flex items-center justify-center rounded-full dark:text-white">
 																<XMarkIcon className="h-5 w-5" />
 															</Dialog.Close>

packages/react/src/components/IDKitWidget/States/ErrorState.tsx

@@ -50,11 +50,10 @@ const ErrorState = () => {
 			</div>
 			<div>
 				<p className="text-center text-2xl font-semibold text-gray-900 dark:text-white">
-					{(errorState?.code && ERROR_TITLES[errorState.code]) || ERROR_TITLES[AppErrorCodes.GenericError]}
+					{(errorState?.code && ERROR_TITLES[errorState.code]) ?? ERROR_TITLES[AppErrorCodes.GenericError]}
 				</p>
 				<p className="mx-auto mt-2 max-w-[224px] text-center text-657080">
-					{/* eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing */}
-					{errorState?.message || ERROR_MESSAGES[errorState?.code ?? AppErrorCodes.GenericError]}
+					{errorState?.message ?? ERROR_MESSAGES[errorState?.code ?? AppErrorCodes.GenericError]}
 				</p>
 			</div>
 			<div className="flex justify-center">

packages/react/src/components/IDKitWidget/States/HostAppVerificationState.tsx

@@ -13,7 +13,7 @@ const HostAppVerificationState = () => {
 			<div className="flex justify-center">
 				<LoadingIcon className="h-24 w-24" />
 			</div>
-			<div className="text-70868f mt-4">{__('Transmitting verification to host app. Please wait...')}</div>
+			<div className="mt-4 text-70868f">{__('Transmitting verification to host app. Please wait...')}</div>
 		</div>
 	)
 }