refactor: Replace deprecated project builder web components with ui components

.changeset/smooth-ducks-crash.md

@@ -0,0 +1,5 @@
+---
+'@halfdomelabs/project-builder-web': patch
+---
+
+Replace older components from project-builder-web with newer ui components

packages/project-builder-web/package.json

@@ -41,7 +41,6 @@
     "@halfdomelabs/project-builder-lib": "workspace:*",
     "@halfdomelabs/ui-components": "workspace:*",
     "@halfdomelabs/utils": "workspace:*",
-    "@headlessui/react": "1.7.18",
     "@hookform/resolvers": "3.9.0",
     "@testing-library/dom": "10.4.0",
     "@testing-library/jest-dom": "6.6.3",

packages/project-builder-web/src/app/App.tsx

@@ -5,10 +5,8 @@ import { ErrorHandlerContext } from '@halfdomelabs/project-builder-lib/web';
 import { ConfirmDialog, Toaster, Tooltip } from '@halfdomelabs/ui-components';
 import { useMemo } from 'react';
 import { Outlet } from 'react-router-dom';
-import { ErrorBoundary } from 'src/components/ErrorBoundary/ErrorBoundary';
 
-import { BlockerDialog } from '@src/components';
-import { RefIssueDialog } from '@src/components/RefIssueDialog/RefIssueDialog';
+import { BlockerDialog, ErrorBoundary, RefIssueDialog } from '@src/components';
 import { formatError, logAndFormatError } from '@src/services/error-formatter';
 import { logError } from '@src/services/error-logger';
 

packages/project-builder-web/src/app/AppLayout/ProjectSyncModal.tsx

@@ -8,13 +8,13 @@ import { Button, Dialog, toast } from '@halfdomelabs/ui-components';
 import clsx from 'clsx';
 import { useRef, useState } from 'react';
 import { MdSync } from 'react-icons/md';
-import { startSync } from 'src/services/api';
-import { formatError } from 'src/services/error-formatter';
 
 import type { ConsoleRef } from '@src/components';
 
 import { Console } from '@src/components';
 import { useProjects } from '@src/hooks/useProjects';
+import { startSync } from '@src/services/api';
+import { formatError } from '@src/services/error-formatter';
 
 interface Props {
   className?: string;

packages/project-builder-web/src/app/ClientVersionProvider/ClientVersionProvider.test.tsx

@@ -1,8 +1,8 @@
 import { render, screen, waitFor } from '@testing-library/react';
-import { getVersionInfo } from 'src/services/api';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { useClientVersion } from '@src/hooks/useClientVersion';
+import { getVersionInfo } from '@src/services/api';
 import { trpcWebsocketEvents } from '@src/services/trpc';
 
 import { ClientVersionProvider } from './ClientVersionProvider';

packages/project-builder-web/src/app/ProjectDefinitionProvider/ProjectDefinitionProvider.tsx

@@ -21,12 +21,12 @@ import {
 import { produce } from 'immer';
 import { useMemo, useState } from 'react';
 import semver from 'semver';
-import { useClientVersion } from 'src/hooks/useClientVersion';
-import { useProjects } from 'src/hooks/useProjects';
-import { formatError, logAndFormatError } from 'src/services/error-formatter';
-import { RefDeleteError } from 'src/utils/error';
 
+import { useClientVersion } from '@src/hooks/useClientVersion';
 import { useDeleteReferenceDialog } from '@src/hooks/useDeleteReferenceDialog';
+import { useProjects } from '@src/hooks/useProjects';
+import { formatError, logAndFormatError } from '@src/services/error-formatter';
+import { RefDeleteError } from '@src/utils/error';
 
 import { useProjectDefinitionContainer } from './hooks/use-project-definition-container';
 import { useRemoteProjectDefinitionContents } from './hooks/use-remote-project-definition-contents';

packages/project-builder-web/src/app/ProjectSelectorGate/ProjectSelectorDialog.tsx

@@ -8,10 +8,10 @@ import {
 } from '@halfdomelabs/ui-components';
 import { useEffect, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { useProjects } from 'src/hooks/useProjects';
-import { logError } from 'src/services/error-logger';
 
+import { useProjects } from '@src/hooks/useProjects';
 import { getProjects } from '@src/services/api';
+import { logError } from '@src/services/error-logger';
 
 interface ProjectSelectDialogProps {
   onClose?: () => void;

packages/project-builder-web/src/app/ProjectSelectorGate/ProjectSelectorGate.tsx

@@ -2,10 +2,10 @@ import type React from 'react';
 
 import { ErrorableLoader } from '@halfdomelabs/ui-components';
 import { useEffect, useState } from 'react';
-import { useProjects } from 'src/hooks/useProjects';
-import { logError } from 'src/services/error-logger';
 
+import { useProjects } from '@src/hooks/useProjects';
 import { getProjects } from '@src/services/api';
+import { logError } from '@src/services/error-logger';
 import { setLocalStorageProjectId } from '@src/services/project-id.service';
 
 import { ProjectSelectDialog } from './ProjectSelectorDialog';