Skip to content

Commit fce5d3d

Browse files
tomast1337tomast1337
committed
Revert "feat(ui): add Button, Input, Label, Textarea components and update package dependencies"
This reverts commit fb03997.
1 parent c6c28c9 commit fce5d3d

12 files changed

Lines changed: 39 additions & 198 deletions

File tree

‎apps/frontend/package.json‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,9 @@
2020
"@nbw/config": "workspace:*",
2121
"@nbw/song": "workspace:*",
2222
"@nbw/thumbnail": "workspace:*",
23-
"@nbw/validation": "workspace:*",
2423
"@next/mdx": "^16.0.8",
2524
"@next/third-parties": "^16.0.8",
2625
"@radix-ui/react-dialog": "^1.1.15",
27-
"@radix-ui/react-label": "^2.1.8",
2826
"@radix-ui/react-popover": "^1.1.15",
2927
"@radix-ui/react-select": "^2.2.6",
3028
"@radix-ui/react-slider": "^1.3.6",

‎apps/frontend/src/modules/shared/components/ui/button.tsx‎

Lines changed: 0 additions & 58 deletions
This file was deleted.

‎apps/frontend/src/modules/shared/components/ui/input.tsx‎

Lines changed: 0 additions & 22 deletions
This file was deleted.

‎apps/frontend/src/modules/shared/components/ui/label.tsx‎

Lines changed: 0 additions & 26 deletions
This file was deleted.

‎apps/frontend/src/modules/shared/components/ui/textarea.tsx‎

Lines changed: 0 additions & 22 deletions
This file was deleted.

‎apps/frontend/src/modules/song-upload/components/client/context/UploadSong.context.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ import { create } from 'zustand';
1313

1414
import { BG_COLORS, THUMBNAIL_CONSTANTS, UPLOAD_CONSTANTS } from '@nbw/config';
1515
import { parseSongFromBuffer, type SongFileType } from '@nbw/song';
16+
import axiosInstance from '@web/lib/axios';
17+
import { InvalidTokenError, getTokenLocal } from '@web/lib/axios/token.utils';
1618
import {
1719
UploadSongFormInput,
1820
UploadSongFormOutput,
1921
uploadSongFormSchema,
2022
} from '@nbw/validation';
21-
import axiosInstance from '@web/lib/axios';
22-
import { InvalidTokenError, getTokenLocal } from '@web/lib/axios/token.utils';
2323

2424
import UploadCompleteModal from '../UploadCompleteModal';
2525

‎apps/frontend/src/modules/song/components/client/SongThumbnailInput.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { useMemo } from 'react';
22
import { UseFormReturn } from 'react-hook-form';
33

44
import { BG_COLORS, THUMBNAIL_CONSTANTS } from '@nbw/config';
5-
import { EditSongFormInput, UploadSongFormInput } from '@nbw/validation';
65
import { cn } from '@web/lib/utils';
76
import { Slider } from '@web/modules/shared/components/client/FormElements';
87
import {
@@ -12,6 +11,7 @@ import {
1211
} from '@web/modules/shared/components/tooltip';
1312

1413
import { useSongProvider } from './context/Song.context';
14+
import { EditSongFormInput, UploadSongFormInput } from '@nbw/validation';
1515
import { ThumbnailRendererCanvas } from './ThumbnailRenderer';
1616

1717
const formatZoomLevel = (zoomLevel: number) => {

‎apps/frontend/src/modules/song/components/client/ThumbnailRenderer.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { UseFormReturn } from 'react-hook-form';
66
import { THUMBNAIL_CONSTANTS } from '@nbw/config';
77
import { NoteQuadTree } from '@nbw/song';
88
import { drawNotesOffscreen, swap } from '@nbw/thumbnail/browser';
9+
910
import { UploadSongFormInput } from '@nbw/validation';
1011

1112
type ThumbnailRendererCanvasProps = {

‎apps/frontend/src/modules/user/components/client/ProfileBioEditor.tsx‎

Lines changed: 20 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,6 @@ import axiosInstance from '@web/lib/axios';
1010
import { getTokenLocal } from '@web/lib/axios/token.utils';
1111
import { type SocialLinks } from '@web/modules/auth/types/User';
1212
import { ProfileBioMarkdown } from '@web/modules/shared/components/ProfileBioMarkdown';
13-
import { Button } from '@web/modules/shared/components/ui/button';
14-
import { Input } from '@web/modules/shared/components/ui/input';
15-
import { Label } from '@web/modules/shared/components/ui/label';
16-
import { Textarea } from '@web/modules/shared/components/ui/textarea';
1713

1814
import { socialKeys, SOCIAL_LINK_ICONS } from './socialKeys';
1915

@@ -46,9 +42,6 @@ function cleanSocialLinks(links: SocialLinks): SocialLinks {
4642
return out;
4743
}
4844

49-
const fieldInputClass =
50-
'border-zinc-600 bg-zinc-900 text-zinc-100 placeholder:text-zinc-500';
51-
5245
export function ProfileBioEditor({ profile, isOwner }: ProfileBioEditorProps) {
5346
const router = useRouter();
5447
const [isEditing, setIsEditing] = useState(false);
@@ -106,40 +99,34 @@ export function ProfileBioEditor({ profile, isOwner }: ProfileBioEditorProps) {
10699
<div className='flex items-start justify-between gap-2'>
107100
<h2 className='text-lg font-semibold text-zinc-200'>About</h2>
108101
{isOwner && !isEditing && (
109-
<Button
102+
<button
110103
type='button'
111-
variant='ghost'
112-
size='icon'
113104
onClick={() => setIsEditing(true)}
114-
className='text-zinc-500 hover:bg-transparent hover:text-zinc-300'
105+
className='text-zinc-500 hover:text-zinc-300 p-1 rounded'
115106
aria-label='Edit profile'
116107
>
117-
<Pencil className='h-5 w-5' />
118-
</Button>
108+
<Pencil className='w-5 h-5' />
109+
</button>
119110
)}
120111
{isOwner && isEditing && (
121112
<div className='flex gap-1'>
122-
<Button
113+
<button
123114
type='button'
124-
variant='ghost'
125-
size='icon'
126115
onClick={cancel}
127-
className='text-zinc-500 hover:bg-transparent hover:text-zinc-300'
116+
className='text-zinc-500 hover:text-zinc-300 p-1 rounded'
128117
aria-label='Cancel'
129118
>
130-
<X className='h-5 w-5' />
131-
</Button>
132-
<Button
119+
<X className='w-5 h-5' />
120+
</button>
121+
<button
133122
type='button'
134-
variant='ghost'
135-
size='icon'
136123
onClick={() => void save()}
137124
disabled={saving}
138-
className='text-zinc-500 hover:bg-transparent hover:text-zinc-300 disabled:opacity-50'
125+
className='text-zinc-500 hover:text-zinc-300 p-1 rounded disabled:opacity-50'
139126
aria-label='Save'
140127
>
141-
<Check className='h-5 w-5' />
142-
</Button>
128+
<Check className='w-5 h-5' />
129+
</button>
143130
</div>
144131
)}
145132
</div>
@@ -148,30 +135,25 @@ export function ProfileBioEditor({ profile, isOwner }: ProfileBioEditorProps) {
148135

149136
{isEditing ? (
150137
<div className='mt-3 flex flex-col gap-4'>
151-
<Textarea
138+
<textarea
152139
value={description}
153140
onChange={(e) => setDescription(e.target.value)}
154141
rows={12}
155-
className={`font-mono text-sm min-h-48 ${fieldInputClass}`}
142+
className='w-full rounded-lg border border-zinc-600 bg-zinc-950 p-3 text-zinc-100 font-mono text-sm'
156143
/>
157144
<div className='grid grid-cols-1 sm:grid-cols-2 gap-3'>
158145
{socialKeys.map((key) => {
159146
const Icon = SOCIAL_LINK_ICONS[key];
160-
const id = `profile-social-${key}`;
161147
return (
162-
<div key={key} className='flex flex-col gap-1 text-sm'>
163-
<Label
164-
htmlFor={id}
165-
className='text-zinc-400 flex items-center gap-2 capitalize font-normal'
166-
>
148+
<label key={key} className='flex flex-col gap-1 text-sm'>
149+
<span className='text-zinc-400 flex items-center gap-2 capitalize'>
167150
<Icon
168151
className='w-4 h-4 shrink-0 text-zinc-500'
169152
aria-hidden
170153
/>
171154
{key}
172-
</Label>
173-
<Input
174-
id={id}
155+
</span>
156+
<input
175157
type='url'
176158
value={socialLinks[key] ?? ''}
177159
onChange={(e) =>
@@ -180,10 +162,10 @@ export function ProfileBioEditor({ profile, isOwner }: ProfileBioEditorProps) {
180162
[key]: e.target.value,
181163
}))
182164
}
183-
className={`h-8 px-2 py-1 text-sm ${fieldInputClass}`}
165+
className='rounded border border-zinc-600 bg-zinc-900 px-2 py-1 text-zinc-100'
184166
placeholder='https://'
185167
/>
186-
</div>
168+
</label>
187169
);
188170
})}
189171
</div>

‎apps/frontend/src/modules/user/components/client/ProfilePublicNameEditor.tsx‎

Lines changed: 14 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ import { useCallback, useEffect, useState } from 'react';
77
import type { PublicProfileDto } from '@nbw/validation';
88
import axiosInstance from '@web/lib/axios';
99
import { getTokenLocal } from '@web/lib/axios/token.utils';
10-
import { Button } from '@web/modules/shared/components/ui/button';
11-
import { Input } from '@web/modules/shared/components/ui/input';
1210

1311
type ProfilePublicNameEditorProps = {
1412
profile: PublicProfileDto;
@@ -68,12 +66,12 @@ export function ProfilePublicNameEditor({
6866
<div className='min-w-0'>
6967
<div className='flex items-center gap-2'>
7068
{isEditing ? (
71-
<Input
69+
<input
7270
type='text'
7371
value={publicName}
7472
onChange={(e) => setPublicName(e.target.value)}
7573
maxLength={100}
76-
className='flex-1 min-w-0 text-2xl font-bold text-zinc-100 h-auto py-1 border-zinc-600 bg-zinc-900'
74+
className='flex-1 min-w-0 text-2xl font-bold text-zinc-100 bg-zinc-900 border border-zinc-600 rounded-lg px-2 py-1'
7775
aria-label='Display name'
7876
/>
7977
) : (
@@ -82,40 +80,34 @@ export function ProfilePublicNameEditor({
8280
</h1>
8381
)}
8482
{!isEditing && (
85-
<Button
83+
<button
8684
type='button'
87-
variant='ghost'
88-
size='icon'
8985
onClick={() => setIsEditing(true)}
90-
className='shrink-0 text-zinc-500 hover:bg-transparent hover:text-zinc-300'
86+
className='text-zinc-500 hover:text-zinc-300 p-1 rounded shrink-0'
9187
aria-label='Edit display name'
9288
>
93-
<Pencil className='h-5 w-5' />
94-
</Button>
89+
<Pencil className='w-5 h-5' />
90+
</button>
9591
)}
9692
{isEditing && (
9793
<div className='flex gap-1 shrink-0'>
98-
<Button
94+
<button
9995
type='button'
100-
variant='ghost'
101-
size='icon'
10296
onClick={cancel}
103-
className='text-zinc-500 hover:bg-transparent hover:text-zinc-300'
97+
className='text-zinc-500 hover:text-zinc-300 p-1 rounded'
10498
aria-label='Cancel'
10599
>
106-
<X className='h-5 w-5' />
107-
</Button>
108-
<Button
100+
<X className='w-5 h-5' />
101+
</button>
102+
<button
109103
type='button'
110-
variant='ghost'
111-
size='icon'
112104
onClick={() => void save()}
113105
disabled={saving || publicName.trim().length === 0}
114-
className='text-zinc-500 hover:bg-transparent hover:text-zinc-300 disabled:opacity-50'
106+
className='text-zinc-500 hover:text-zinc-300 p-1 rounded disabled:opacity-50'
115107
aria-label='Save'
116108
>
117-
<Check className='h-5 w-5' />
118-
</Button>
109+
<Check className='w-5 h-5' />
110+
</button>
119111
</div>
120112
)}
121113
</div>

0 commit comments

Comments
 (0)