Skip to content

Commit 6104fca

Browse files
BunsDevBunsDev
committed
fix: update text in ChatHome component for clarity and consistency — revised project description to enhance user understanding
1 parent 3df1f9c commit 6104fca

1 file changed

Lines changed: 96 additions & 43 deletions

File tree

‎components/chat-home.tsx‎

Lines changed: 96 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,10 @@ export const ChatHome = memo(function ChatHome({
117117

118118
// Fetch GitHub user when token is available
119119
useEffect(() => {
120-
if (!ghToken) { setGhUser(null); return }
120+
if (!ghToken) {
121+
setGhUser(null)
122+
return
123+
}
121124
fetchAuthenticatedUser().then((u) => setGhUser(u))
122125
}, [ghToken])
123126

@@ -148,13 +151,15 @@ export const ChatHome = memo(function ChatHome({
148151
fullName: ghRepo.full_name,
149152
}
150153
setRepo(info)
151-
setSavedRecents(addRecent({
152-
fullName: ghRepo.full_name,
153-
name: ghRepo.name,
154-
owner: ghRepo.owner.login,
155-
defaultBranch: ghRepo.default_branch,
156-
addedAt: Date.now(),
157-
}))
154+
setSavedRecents(
155+
addRecent({
156+
fullName: ghRepo.full_name,
157+
name: ghRepo.name,
158+
owner: ghRepo.owner.login,
159+
defaultBranch: ghRepo.default_branch,
160+
addedAt: Date.now(),
161+
}),
162+
)
158163
setShowRepoInput(false)
159164
setRepoInput('')
160165
} catch (err) {
@@ -164,16 +169,19 @@ export const ChatHome = memo(function ChatHome({
164169
}
165170
}, [repoInput, setRepo])
166171

167-
const selectSavedRepo = useCallback((saved: SavedRepo) => {
168-
const info: RepoInfo = {
169-
owner: saved.owner,
170-
repo: saved.name,
171-
branch: saved.defaultBranch,
172-
fullName: saved.fullName,
173-
}
174-
setRepo(info)
175-
setSavedRecents(addRecent(saved))
176-
}, [setRepo])
172+
const selectSavedRepo = useCallback(
173+
(saved: SavedRepo) => {
174+
const info: RepoInfo = {
175+
owner: saved.owner,
176+
repo: saved.name,
177+
branch: saved.defaultBranch,
178+
fullName: saved.fullName,
179+
}
180+
setRepo(info)
181+
setSavedRecents(addRecent(saved))
182+
},
183+
[setRepo],
184+
)
177185

178186
useEffect(() => {
179187
if (showRepoInput) {
@@ -285,8 +293,8 @@ export const ChatHome = memo(function ChatHome({
285293
<h1 className="text-center text-[28px] sm:text-[32px] font-semibold tracking-[-0.04em] leading-none text-[var(--text-primary)]">
286294
Let&apos;s weave
287295
</h1>
288-
<p className="mt-2 max-w-[24rem] text-center text-[12px] leading-5 text-[var(--text-disabled)] sm:text-[13px]">
289-
Open a repo or describe the change you want, and Knot Code will help you shape it.
296+
<p className="mt-2 max-w-[28rem] text-center text-[12px] leading-5 text-[var(--text-disabled)] sm:text-[13px]">
297+
Open a project or describe changes, and we&apos;ll help you shape it.
290298
</p>
291299

292300
{/* Workspace dropdown — hidden on mobile */}
@@ -317,17 +325,29 @@ export const ChatHome = memo(function ChatHome({
317325
{/* Favorites */}
318326
{savedFavorites.length > 0 && (
319327
<div>
320-
<p className="text-[10px] uppercase tracking-wider text-[var(--text-disabled)] font-medium mb-1.5 px-1">Favorites</p>
328+
<p className="text-[10px] uppercase tracking-wider text-[var(--text-disabled)] font-medium mb-1.5 px-1">
329+
Favorites
330+
</p>
321331
<div className="space-y-0.5">
322-
{savedFavorites.map(r => (
332+
{savedFavorites.map((r) => (
323333
<button
324334
key={r.fullName}
325335
onClick={() => selectSavedRepo(r)}
326336
className="w-full flex items-center gap-2 px-2.5 py-2 rounded-lg hover:bg-[color-mix(in_srgb,var(--text-primary)_6%,transparent)] transition-colors cursor-pointer text-left"
327337
>
328-
<Icon icon="lucide:star" width={12} className="text-amber-400 shrink-0" />
329-
<span className="text-[12px] text-[var(--text-primary)] truncate flex-1">{r.fullName}</span>
330-
<Icon icon="lucide:chevron-right" width={12} className="text-[var(--text-disabled)] shrink-0" />
338+
<Icon
339+
icon="lucide:star"
340+
width={12}
341+
className="text-amber-400 shrink-0"
342+
/>
343+
<span className="text-[12px] text-[var(--text-primary)] truncate flex-1">
344+
{r.fullName}
345+
</span>
346+
<Icon
347+
icon="lucide:chevron-right"
348+
width={12}
349+
className="text-[var(--text-disabled)] shrink-0"
350+
/>
331351
</button>
332352
))}
333353
</div>
@@ -337,19 +357,34 @@ export const ChatHome = memo(function ChatHome({
337357
{/* Recents */}
338358
{savedRecents.length > 0 && (
339359
<div>
340-
<p className="text-[10px] uppercase tracking-wider text-[var(--text-disabled)] font-medium mb-1.5 px-1">Recent</p>
360+
<p className="text-[10px] uppercase tracking-wider text-[var(--text-disabled)] font-medium mb-1.5 px-1">
361+
Recent
362+
</p>
341363
<div className="space-y-0.5">
342-
{savedRecents.filter(r => !savedFavorites.some(f => f.fullName === r.fullName)).slice(0, 5).map(r => (
343-
<button
344-
key={r.fullName}
345-
onClick={() => selectSavedRepo(r)}
346-
className="w-full flex items-center gap-2 px-2.5 py-2 rounded-lg hover:bg-[color-mix(in_srgb,var(--text-primary)_6%,transparent)] transition-colors cursor-pointer text-left"
347-
>
348-
<Icon icon="lucide:clock" width={12} className="text-[var(--text-disabled)] shrink-0" />
349-
<span className="text-[12px] text-[var(--text-primary)] truncate flex-1">{r.fullName}</span>
350-
<Icon icon="lucide:chevron-right" width={12} className="text-[var(--text-disabled)] shrink-0" />
351-
</button>
352-
))}
364+
{savedRecents
365+
.filter((r) => !savedFavorites.some((f) => f.fullName === r.fullName))
366+
.slice(0, 5)
367+
.map((r) => (
368+
<button
369+
key={r.fullName}
370+
onClick={() => selectSavedRepo(r)}
371+
className="w-full flex items-center gap-2 px-2.5 py-2 rounded-lg hover:bg-[color-mix(in_srgb,var(--text-primary)_6%,transparent)] transition-colors cursor-pointer text-left"
372+
>
373+
<Icon
374+
icon="lucide:clock"
375+
width={12}
376+
className="text-[var(--text-disabled)] shrink-0"
377+
/>
378+
<span className="text-[12px] text-[var(--text-primary)] truncate flex-1">
379+
{r.fullName}
380+
</span>
381+
<Icon
382+
icon="lucide:chevron-right"
383+
width={12}
384+
className="text-[var(--text-disabled)] shrink-0"
385+
/>
386+
</button>
387+
))}
353388
</div>
354389
</div>
355390
)}
@@ -370,15 +405,28 @@ export const ChatHome = memo(function ChatHome({
370405
<div className="w-full">
371406
<div className="flex items-center gap-1.5">
372407
<div className="flex-1 relative">
373-
<Icon icon="lucide:github" width={14} height={14} className="absolute left-2.5 top-1/2 -translate-y-1/2 text-[var(--text-disabled)]" />
408+
<Icon
409+
icon="lucide:github"
410+
width={14}
411+
height={14}
412+
className="absolute left-2.5 top-1/2 -translate-y-1/2 text-[var(--text-disabled)]"
413+
/>
374414
<input
375415
ref={repoInputRef}
376416
type="text"
377417
value={repoInput}
378-
onChange={(e) => { setRepoInput(e.target.value); setRepoError(null) }}
379-
onKeyDown={(e) => { if (e.key === 'Enter') handleRepoConnect(); if (e.key === 'Escape') setShowRepoInput(false) }}
418+
onChange={(e) => {
419+
setRepoInput(e.target.value)
420+
setRepoError(null)
421+
}}
422+
onKeyDown={(e) => {
423+
if (e.key === 'Enter') handleRepoConnect()
424+
if (e.key === 'Escape') setShowRepoInput(false)
425+
}}
380426
placeholder="owner/repo"
381-
autoCapitalize="off" autoCorrect="off" spellCheck={false}
427+
autoCapitalize="off"
428+
autoCorrect="off"
429+
spellCheck={false}
382430
className="w-full pl-8 pr-3 py-2 rounded-lg border border-[var(--border)] bg-[color-mix(in_srgb,var(--bg-elevated)_80%,transparent)] text-[13px] text-[var(--text-primary)] placeholder:text-[var(--text-disabled)] outline-none focus:border-[var(--brand)] transition-colors"
383431
/>
384432
</div>
@@ -390,14 +438,19 @@ export const ChatHome = memo(function ChatHome({
390438
{repoLoading ? '…' : 'Go'}
391439
</button>
392440
</div>
393-
{repoError && <p className="mt-1.5 text-[11px] text-[var(--color-deletions)]">{repoError}</p>}
441+
{repoError && (
442+
<p className="mt-1.5 text-[11px] text-[var(--color-deletions)]">{repoError}</p>
443+
)}
394444
</div>
395445
)}
396446

397447
{/* Connected repo — tap to switch */}
398448
{hasWorkspace && (
399449
<button
400-
onClick={() => { setRepo(null); setShowRepoInput(false) }}
450+
onClick={() => {
451+
setRepo(null)
452+
setShowRepoInput(false)
453+
}}
401454
className="inline-flex items-center gap-1.5 text-[13px] text-[var(--text-secondary)] hover:text-[var(--text-primary)] transition-colors cursor-pointer"
402455
>
403456
<Icon icon="lucide:folder-git-2" width={13} height={13} className="opacity-60" />

0 commit comments

Comments
 (0)