Skip to content

Commit 61b76c9

Browse files
committed
cleanup
1 parent 0b03988 commit 61b76c9

File tree

5 files changed

+50
-72
lines changed

5 files changed

+50
-72
lines changed

browser-chat/frontend/src/app.tsx

Lines changed: 10 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import Header from "./components/header"
77
import Sidebar from "./components/sidebar"
88
import { ThemeProvider } from "next-themes"
99
import { API, initApi, type ChannelInfo } from "./lib/api"
10-
import { generate as generateName } from 'yet-another-name-generator'
1110
import { log } from "./lib/log"
1211
import { useIsDesktop } from "./hooks/use-media-query"
1312

@@ -63,26 +62,27 @@ function App({ api }: AppProps) {
6362
const [currentView, setCurrentView] = useState<"home" | "chat">("home")
6463
const [channels, setChannels] = useState<ChannelInfo[]>([])
6564
const [activeChannel, setActiveChannel] = useState<string | null>(null)
66-
const [nickname, setNickname] = useState(generateName())
6765
const [showSidebar, setShowSidebar] = useState(false)
6866

69-
const joinChannel = async (ticket: string) => {
67+
const joinChannel = (ticket: string, nickname: string) => {
7068
try {
71-
const channel = await api.joinChannel(ticket, nickname)
69+
const channel = api.joinChannel(ticket, nickname)
7270
setChannels((prevChannels) => [...prevChannels, channel])
73-
setActiveChannel(channel.id)
7471
setCurrentView("chat")
72+
setActiveChannel(channel.id)
73+
setShowSidebar(true)
7574
} catch (error) {
7675
log.error("Failed to join channel", error)
7776
}
7877
}
7978

80-
const createChannel = async () => {
79+
const createChannel = (nickname: string) => {
8180
try {
82-
const channel = await api.createChannel(nickname)
81+
const channel = api.createChannel(nickname)
8382
setChannels((prevChannels) => [...prevChannels, channel])
8483
setActiveChannel(channel.id)
8584
setCurrentView("chat")
85+
setShowSidebar(true)
8686
} catch (error) {
8787
log.error("Failed to create channel", error)
8888
}
@@ -117,7 +117,7 @@ function App({ api }: AppProps) {
117117

118118
return (
119119
<>
120-
{isDesktop && (currentView === "chat" || showSidebar) && (
120+
{isDesktop && (showSidebar) && (
121121
<Sidebar
122122
channels={channels}
123123
activeChannel={activeChannel}
@@ -134,32 +134,13 @@ function App({ api }: AppProps) {
134134
/>
135135
{currentView === "home" && (
136136
<HomeScreen
137-
name={nickname}
138-
onSetName={setNickname}
139-
onJoin={(ticket) => {
140-
joinChannel(ticket)
141-
setShowSidebar(false)
142-
}}
143-
onCreate={() => {
144-
createChannel()
145-
setShowSidebar(false)
146-
}}
137+
onJoin={joinChannel}
138+
onCreate={createChannel}
147139
/>
148140
)}
149141
{currentView === "chat" && activeChannel && (
150142
<ChatView api={api} channel={activeChannel} onClose={() => closeChannel(activeChannel)} />
151143
)}
152-
{/* {showInvitePopup && activeChannel && (
153-
<InvitePopup
154-
open={showInvitePopup}
155-
onOpenChange={(x) => {
156-
console.log("openchange", x)
157-
setShowInvitePopup(x)
158-
}}
159-
channel={channels.find((c) => c.id === activeChannel)?.name || ""}
160-
getTicket={(opts) => api.getTicket(activeChannel!, opts)}
161-
/>
162-
)} */}
163144
</div>
164145
</>
165146
)

browser-chat/frontend/src/components/homescreen.tsx

Lines changed: 23 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -4,35 +4,33 @@ import { useState, type FormEvent } from "react"
44
import { Button } from "@/components/ui/button"
55
import { Input } from "@/components/ui/input"
66

7+
import { generate as generateName } from 'yet-another-name-generator'
8+
79
interface HomeScreenProps {
8-
name: string
9-
onSetName: (name: string) => void
10-
onJoin: (ticket: string) => void
11-
onCreate: () => void
10+
onJoin: (ticket: string, nickname: string) => void
11+
onCreate: (nickname: string) => void
1212
}
1313

14-
export default function HomeScreen({ onJoin, onCreate, name, onSetName }: HomeScreenProps) {
14+
export default function HomeScreen({ onJoin, onCreate }: HomeScreenProps) {
1515
const [ticket, setTicket] = useState(() => {
1616
const url = new URL(document.location.toString())
1717
const ticket = url.searchParams.get("ticket")
1818
if (ticket?.startsWith("chat")) return ticket
1919
return ""
2020
})
21-
// const [channelName, setChannelName] = useState("")
21+
22+
const [nickname, setNickname] = useState(generateName())
2223

2324
const handleJoin = (e: FormEvent) => {
2425
e.preventDefault()
2526
if (ticket.trim()) {
26-
onJoin(ticket.trim())
27+
onJoin(ticket.trim(), nickname)
2728
}
2829
}
2930

3031
const handleCreate = (e: FormEvent) => {
3132
e.preventDefault()
32-
onCreate()
33-
// if (channelName.trim()) {
34-
// onCreate(channelName.trim())
35-
// }
33+
onCreate(nickname)
3634
}
3735

3836
return (
@@ -41,32 +39,22 @@ export default function HomeScreen({ onJoin, onCreate, name, onSetName }: HomeSc
4139
<div>
4240
<h2 className="text-lg font-semibold mb-2">Your name</h2>
4341
<div className="flex space-x-2">
44-
<Input value={name} onChange={(e) => onSetName(e.target.value)} placeholder="Enter your name" />
42+
<Input value={nickname} onChange={(e) => setNickname(e.target.value)} placeholder="Enter your name" />
4543
</div>
4644
</div>
47-
{name.length && (
48-
<>
49-
<form onSubmit={handleJoin}>
50-
<h2 className="text-lg font-semibold mb-2">Join Channel</h2>
51-
<div className="flex space-x-2">
52-
<Input value={ticket} onChange={(e) => setTicket(e.target.value)} placeholder="Enter ticket" />
53-
<Button type="submit">Join</Button>
54-
</div>
55-
</form>
56-
<form onSubmit={handleCreate}>
57-
<h2 className="text-lg font-semibold mb-2">Create Channel</h2>
58-
<div className="flex space-x-2">
59-
{/* <Input
60-
value={channelName}
61-
onChange={(e) => setChannelName(e.target.value)}
62-
placeholder="Enter channel name"
63-
/> */}
64-
<Button type="submit">Create</Button>
65-
</div>
66-
</form>
67-
68-
</>
69-
)}
45+
<form onSubmit={handleJoin}>
46+
<h2 className="text-lg font-semibold mb-2">Join Channel</h2>
47+
<div className="flex space-x-2">
48+
<Input value={ticket} onChange={(e) => setTicket(e.target.value)} placeholder="Enter ticket" />
49+
<Button type="submit" disabled={!nickname.length || !ticket.length}>Join</Button>
50+
</div>
51+
</form>
52+
<form onSubmit={handleCreate}>
53+
<h2 className="text-lg font-semibold mb-2">Create Channel</h2>
54+
<div className="flex space-x-2">
55+
<Button type="submit" disabled={!nickname.length}>Create</Button>
56+
</div>
57+
</form>
7058
</div>
7159
</div>
7260
)

browser-chat/frontend/src/components/invitepopup.tsx

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,9 @@ export function InvitePopupContent({ channel, getTicket }: InvitePopupProps) {
7676

7777
const cliCommand = `cargo run -- join ${ticket}`
7878

79+
const ticketUrlFull = ticketUrl(ticket)
80+
const ticketUrlShort = ticketUrl(ticket.substring(0, 16))
81+
7982
return (
8083
<>
8184
<div className="mb-4">
@@ -90,9 +93,15 @@ export function InvitePopupContent({ channel, getTicket }: InvitePopupProps) {
9093
</div>
9194
<div className="mb-4">
9295
<p className="font-semibold mb-2">Join link</p>
93-
<a href={ticketUrl(ticket)} className="text-blue-500 hover:underline" target="_blank">
94-
{ticketUrl(ticket.substring(0, 16))}...
95-
</a>
96+
<div className="flex items-center space-x-2">
97+
<a href={ticketUrlFull} className="text-blue-500 hover:underline" target="_blank">
98+
{ticketUrlShort}
99+
</a>
100+
<Button variant="outline" size="sm" onClick={() => copyToClipboard(ticketUrlFull)}>
101+
<Copy className="w-4 h-4 mr-2" />
102+
Copy
103+
</Button>
104+
</div>
96105
</div>
97106
<div className="mb-4">
98107
<p className="font-semibold mb-2">Join from the command line</p>

browser-chat/frontend/src/lib/api.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ async function importAndInitOnce() {
2222
}
2323

2424
export interface API {
25-
createChannel(nickname: string): Promise<ChannelInfo>
26-
joinChannel(ticket: string, nickname: string): Promise<ChannelInfo>
27-
sendMessage(channelId: string, message: string): Promise<void>
25+
createChannel(nickname: string): ChannelInfo
26+
joinChannel(ticket: string, nickname: string): ChannelInfo
27+
sendMessage(channelId: string, message: string): void
2828
setNickname(channelId: string, nickname: string): void
2929
getMessages(channelId: string): Message[]
3030
getPeers(channelId: string): PeerInfo[]

browser-chat/frontend/src/lib/iroh.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,12 @@ export class IrohAPI implements API {
3131
return new IrohAPI(chatNode)
3232
}
3333

34-
async createChannel(nickname: string): Promise<ChannelInfo> {
34+
createChannel(nickname: string): ChannelInfo {
3535
const channel = this.chatNode.create(nickname)
3636
return this.joinInner(channel, nickname)
3737
}
3838

39-
async joinChannel(ticket: string, nickname: string): Promise<ChannelInfo> {
39+
joinChannel(ticket: string, nickname: string): ChannelInfo {
4040
const channel = this.chatNode.join(ticket, nickname)
4141
return this.joinInner(channel, nickname)
4242
}

0 commit comments

Comments
 (0)