feat(devbox): devbox basic frontend ui and logic

.github/workflows/frontend.yml

@@ -67,6 +67,7 @@ jobs:
             providers/objectstorage,
             providers/kubepanel,
             providers/workorder,
+            providers/devbox,
             desktop,
           ]
     steps:
@@ -165,6 +166,7 @@ jobs:
             providers/objectstorage,
             providers/kubepanel,
             providers/workorder,
+            providers/devbox,
             desktop,
           ]
     steps:

frontend/Makefile

@@ -26,6 +26,7 @@ buildTargets := \
 	providers/license \
 	providers/kubepanel \
 	providers/objectstorage \
+	providers/devbox \
 	providers/workorder
 
 buildTargets-all := $(addprefix image-build-,$(buildTargets))

frontend/packages/ui/src/components/RangeInput/index.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import React, { useState } from 'react';
 import { HStack, Input, useNumberInput, IconButton, InputProps } from '@chakra-ui/react';
 import { AddIcon, MinusIcon } from '@chakra-ui/icons';

frontend/packages/ui/src/components/Select/index.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import React, { useRef, forwardRef, useMemo } from 'react';
 import {
   Menu,

frontend/packages/ui/src/components/icons/AddIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const AddIcon = createIcon({

frontend/packages/ui/src/components/icons/ArrowDownSLineIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ArrowDownSLineIcon = createIcon({

frontend/packages/ui/src/components/icons/ArrowExchangeIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ArrowExchangeIcon = createIcon({

frontend/packages/ui/src/components/icons/BucketIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const BucketIcon = createIcon({

frontend/packages/ui/src/components/icons/CancelIcon.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { Icon } from '@chakra-ui/react';
 export default function CancelIcon(props: Parameters<typeof Icon>[0]) {
   return (

frontend/packages/ui/src/components/icons/ChangeIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ChangeIcon = createIcon({

frontend/packages/ui/src/components/icons/ClearOutlineIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ClearOutlineIcon = createIcon({

frontend/packages/ui/src/components/icons/CloseIcon.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { Icon, IconProps } from '@chakra-ui/react';
 
 export default function CloseIcon(props: IconProps) {

frontend/packages/ui/src/components/icons/CopyIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const CopyIcon = createIcon({

frontend/packages/ui/src/components/icons/CreateFolderIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const CreateFolderIcon = createIcon({

frontend/packages/ui/src/components/icons/DeleteIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const DeleteIcon = createIcon({

frontend/packages/ui/src/components/icons/DetailsMoreIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ListIcon = createIcon({

frontend/packages/ui/src/components/icons/DnsIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const DnsIcon = createIcon({

frontend/packages/ui/src/components/icons/DocsIcon.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { Icon, IconProps } from '@chakra-ui/react';
 
 export default function DocsIcon(props: IconProps) {

frontend/packages/ui/src/components/icons/DownloadIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const DownloadIcon = createIcon({

frontend/packages/ui/src/components/icons/EditIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const EditIcon = createIcon({

frontend/packages/ui/src/components/icons/ExpandMoreIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ExpanMoreIcon = createIcon({

frontend/packages/ui/src/components/icons/FileIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const FileIcon = createIcon({

frontend/packages/ui/src/components/icons/FolderIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const FolderIcon = createIcon({

frontend/packages/ui/src/components/icons/GroupAdd.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const GroupAddIcon = createIcon({

frontend/packages/ui/src/components/icons/InfoCircleIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const InfoCircleIcon = createIcon({

frontend/packages/ui/src/components/icons/InfoIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const InfoIcon = createIcon({

frontend/packages/ui/src/components/icons/LeftArrowIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const LeftArrowIcon = createIcon({

frontend/packages/ui/src/components/icons/LinkIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const LinkIcon = createIcon({

frontend/packages/ui/src/components/icons/ListCheckIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 const ListCheckIcon = createIcon({
   displayName: 'ListCheckIcon',

frontend/packages/ui/src/components/icons/ListIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ListIcon = createIcon({

frontend/packages/ui/src/components/icons/MoreIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const MoreIcon = createIcon({

frontend/packages/ui/src/components/icons/PortIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const PortIcon = createIcon({

frontend/packages/ui/src/components/icons/ProviderIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const ProviderIcon = createIcon({

frontend/packages/ui/src/components/icons/RefreshIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const RefreshIcon = createIcon({

frontend/packages/ui/src/components/icons/SearchIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const SearchIcon = createIcon({

frontend/packages/ui/src/components/icons/SortPolygonDownIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const SortPolygonUpIcon = createIcon({

frontend/packages/ui/src/components/icons/SortPolygonUpIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const SortPolygonUpIcon = createIcon({

frontend/packages/ui/src/components/icons/StorageIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const StorageIcon = createIcon({

frontend/packages/ui/src/components/icons/UploadIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const UploadIcon = createIcon({

frontend/packages/ui/src/components/icons/VisibilityIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const VisibityIcon = createIcon({

frontend/packages/ui/src/components/icons/WebHostIcon.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const WebHostIcon = createIcon({

frontend/packages/ui/src/components/icons/line/WarnTriange.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { createIcon } from '@chakra-ui/react';
 
 const WarnTriangeIcon = createIcon({