Retro Bulletin Board Systems on atproto. Web app and TUI.
lazy mirror of alyraffauf/atbbs
atbbs.xyz
forums
python
tui
atproto
bbs
web/ComposeForm: improve attachments flow
+27
-16
+27
-16
web/src/components/ComposeForm.tsx
+27
-16
web/src/components/ComposeForm.tsx
···
88
88
maxLength={bodyMaxLength}
89
89
/>
90
90
91
-
<label className="text-xs text-neutral-500 hover:text-neutral-300 cursor-pointer block">
92
-
attach files
93
-
<input
94
-
name="attachments"
95
-
type="file"
96
-
multiple
97
-
onChange={(e) => onFilesChange(e.target.files)}
98
-
className="hidden"
99
-
/>
100
-
{fileNames && (
101
-
<span className="text-neutral-400 ml-2">{fileNames}</span>
102
-
)}
103
-
</label>
91
+
{fileNames && (
92
+
<div className="flex items-center gap-2 text-xs text-neutral-500">
93
+
<span className="truncate">{fileNames}</span>
94
+
<button
95
+
type="button"
96
+
onClick={() => onFilesChange(null)}
97
+
className="text-neutral-500 hover:text-red-400 shrink-0"
98
+
>
99
+
✕
100
+
</button>
101
+
</div>
102
+
)}
104
103
105
-
<Button type="submit" disabled={posting}>
106
-
{posting ? "posting..." : submitLabel}
107
-
</Button>
104
+
<div className="flex items-center gap-3">
105
+
<Button type="submit" disabled={posting}>
106
+
{posting ? "posting..." : submitLabel}
107
+
</Button>
108
+
<label className="text-neutral-200 cursor-pointer bg-neutral-800 hover:bg-neutral-700 px-4 py-2 rounded inline-block">
109
+
attach
110
+
<input
111
+
name="attachments"
112
+
type="file"
113
+
multiple
114
+
onChange={(e) => onFilesChange(e.target.files)}
115
+
className="hidden"
116
+
/>
117
+
</label>
118
+
</div>
108
119
</form>
109
120
);
110
121
}