Skip to content

Commit dcab735

Browse files
adithyaakrishnaadithyaakrishna
committed
chore: ai review and requested changes
1 parent 3753824 commit dcab735

File tree

15 files changed

+160
-71
lines changed

15 files changed

+160
-71
lines changed

‎apps/sim/app/(landing)/studio/[slug]/animated-blocks.tsx‎

Lines changed: 22 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -20,14 +20,22 @@ export function AnimatedColorBlocks() {
2020
const [blocks, setBlocks] = useState<BlockState[]>(
2121
COLORS.map(() => ({ opacity: prefersReducedMotion ? 1 : 0, transitioning: false }))
2222
)
23+
const timers = useRef<ReturnType<typeof setTimeout>[]>([])
2324
const mounted = useRef(true)
2425

26+
function schedule(fn: () => void, ms: number) {
27+
const id = setTimeout(fn, ms)
28+
timers.current.push(id)
29+
return id
30+
}
31+
2532
useEffect(() => {
2633
mounted.current = true
34+
timers.current = []
2735
if (prefersReducedMotion) return
2836

2937
COLORS.forEach((_, i) => {
30-
setTimeout(() => {
38+
schedule(() => {
3139
if (!mounted.current) return
3240
setBlocks((prev) =>
3341
prev.map((b, idx) => (idx === i ? { opacity: 1, transitioning: true } : b))
@@ -36,22 +44,23 @@ export function AnimatedColorBlocks() {
3644
})
3745

3846
const totalEnterMs = COLORS.length * ENTER_STAGGER_MS + ENTER_DURATION_MS + HOLD_MS
39-
const cycleTimer = setTimeout(() => {
47+
schedule(() => {
4048
if (!mounted.current) return
4149
startCycle()
4250
}, totalEnterMs)
4351

4452
return () => {
4553
mounted.current = false
46-
clearTimeout(cycleTimer)
54+
timers.current.forEach(clearTimeout)
55+
timers.current = []
4756
}
4857
}, [prefersReducedMotion])
4958

5059
function startCycle() {
5160
if (!mounted.current) return
5261

5362
COLORS.forEach((_, i) => {
54-
setTimeout(() => {
63+
schedule(() => {
5564
if (!mounted.current) return
5665
setBlocks((prev) =>
5766
prev.map((b, idx) => (idx === i ? { opacity: 0.15, transitioning: true } : b))
@@ -60,10 +69,10 @@ export function AnimatedColorBlocks() {
6069
})
6170

6271
const exitTotalMs = COLORS.length * EXIT_STAGGER_MS + EXIT_DURATION_MS
63-
setTimeout(() => {
72+
schedule(() => {
6473
if (!mounted.current) return
6574
COLORS.forEach((_, i) => {
66-
setTimeout(() => {
75+
schedule(() => {
6776
if (!mounted.current) return
6877
setBlocks((prev) =>
6978
prev.map((b, idx) =>
@@ -76,7 +85,7 @@ export function AnimatedColorBlocks() {
7685

7786
const cycleDuration =
7887
exitTotalMs + 200 + COLORS.length * ENTER_STAGGER_MS + ENTER_DURATION_MS + HOLD_MS
79-
setTimeout(() => startCycle(), cycleDuration)
88+
schedule(() => startCycle(), cycleDuration)
8089
}
8190

8291
return (
@@ -104,16 +113,18 @@ export function AnimatedColorBlocksVertical() {
104113
transitioning: false,
105114
}))
106115
)
116+
const timers = useRef<ReturnType<typeof setTimeout>[]>([])
107117
const mounted = useRef(true)
108118

109119
useEffect(() => {
110120
mounted.current = true
121+
timers.current = []
111122
if (prefersReducedMotion) return
112123

113124
const baseDelay = COLORS.length * ENTER_STAGGER_MS + 100
114125

115126
COLORS.slice(0, 3).forEach((_, i) => {
116-
setTimeout(
127+
const id = setTimeout(
117128
() => {
118129
if (!mounted.current) return
119130
setBlocks((prev) =>
@@ -122,10 +133,13 @@ export function AnimatedColorBlocksVertical() {
122133
},
123134
baseDelay + i * ENTER_STAGGER_MS
124135
)
136+
timers.current.push(id)
125137
})
126138

127139
return () => {
128140
mounted.current = false
141+
timers.current.forEach(clearTimeout)
142+
timers.current = []
129143
}
130144
}, [prefersReducedMotion])
131145

‎apps/sim/app/(landing)/studio/[slug]/article-sidebar.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export function ArticleSidebar({ author, authors, headings, related }: ArticleSi
3131
style={{ borderRadius: '5px' }}
3232
>
3333
<div
34-
className='flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden border border-[#2A2A2A] bg-[#1C1C1C] font-mono text-lg text-[#2ABBF8]'
34+
className='flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden border border-[#2A2A2A] bg-[#1C1C1C] font-season text-lg text-[#2ABBF8]'
3535
style={{ borderRadius: '5px' }}
3636
>
3737
{a.avatarUrl ? (
@@ -48,7 +48,7 @@ export function ArticleSidebar({ author, authors, headings, related }: ArticleSi
4848
)}
4949
</div>
5050
<div>
51-
<div className='mb-1 font-mono text-[10px] uppercase tracking-widest text-[#FA4EDF]'>
51+
<div className='mb-1 font-season text-[10px] uppercase tracking-widest text-[#FA4EDF]'>
5252
Author
5353
</div>
5454
<h3 className='font-[500] text-[#ECECEC]'>{a.name}</h3>
@@ -57,7 +57,7 @@ export function ArticleSidebar({ author, authors, headings, related }: ArticleSi
5757
href={a.url}
5858
target='_blank'
5959
rel='noopener noreferrer'
60-
className='font-mono text-[11px] text-[#999] transition-colors hover:text-[#ECECEC]'
60+
className='font-season text-[11px] text-[#999] transition-colors hover:text-[#ECECEC]'
6161
>
6262
{a.xHandle ? `@${a.xHandle}` : 'Profile'}
6363
</Link>
@@ -73,7 +73,7 @@ export function ArticleSidebar({ author, authors, headings, related }: ArticleSi
7373

7474
{related.length > 0 && (
7575
<div className='border border-[#2A2A2A] bg-[#232323] p-5' style={{ borderRadius: '5px' }}>
76-
<div className='mb-4 flex items-center gap-2 border-b border-[#2A2A2A] pb-3 font-mono text-[11px] uppercase tracking-widest text-[#ECECEC]'>
76+
<div className='mb-4 flex items-center gap-2 border-b border-[#2A2A2A] pb-3 font-season text-[11px] uppercase tracking-widest text-[#ECECEC]'>
7777
<span className='inline-block h-1.5 w-1.5 bg-[#FFCC02]' aria-hidden='true' />
7878
Recent Logs
7979
</div>
@@ -83,15 +83,15 @@ export function ArticleSidebar({ author, authors, headings, related }: ArticleSi
8383
return (
8484
<Link key={p.slug} href={`/studio/${p.slug}`} className='group block'>
8585
<div
86-
className='mb-1 font-mono text-[9px] uppercase tracking-widest'
86+
className='mb-1 font-season text-[9px] uppercase tracking-widest'
8787
style={{ color }}
8888
>
8989
{p.tags[0] || 'Post'}
9090
</div>
9191
<h4 className='mb-1 text-[13px] font-[500] leading-tight text-[#ECECEC] transition-colors group-hover:text-[#FFCC02]'>
9292
{p.title}
9393
</h4>
94-
<div className='font-mono text-[10px] text-[#666]'>{formatDate(p.date)}</div>
94+
<div className='font-season text-[10px] text-[#666]'>{formatDate(p.date)}</div>
9595
</Link>
9696
)
9797
})}

‎apps/sim/app/(landing)/studio/[slug]/page.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export default async function Page({ params }: { params: Promise<{ slug: string
6363
<div className='max-w-4xl flex-grow xl:mx-auto'>
6464
<Link
6565
href='/studio'
66-
className='group mb-8 inline-flex items-center gap-2 border border-[#2A2A2A] bg-[#232323] px-4 py-2 font-mono text-[11px] uppercase tracking-widest text-[#999] transition-colors hover:text-[#ECECEC]'
66+
className='group mb-8 inline-flex items-center gap-2 border border-[#2A2A2A] bg-[#232323] px-4 py-2 font-season text-[11px] uppercase tracking-widest text-[#999] transition-colors hover:text-[#ECECEC]'
6767
style={{ borderRadius: '5px' }}
6868
>
6969
<ArrowLeft
@@ -86,7 +86,7 @@ export default async function Page({ params }: { params: Promise<{ slug: string
8686
style={{ backgroundColor: categoryColor }}
8787
aria-hidden='true'
8888
/>
89-
<div className='font-mono text-[11px] uppercase tracking-widest text-[#999]'>
89+
<div className='font-season text-[11px] uppercase tracking-widest text-[#999]'>
9090
<time dateTime={post.date} itemProp='datePublished'>
9191
{new Date(post.date).toLocaleDateString('en-US', {
9292
month: 'short',
@@ -114,7 +114,7 @@ export default async function Page({ params }: { params: Promise<{ slug: string
114114

115115
{post.tags.length > 0 && (
116116
<ArticleHeaderItem>
117-
<div className='flex flex-wrap items-center gap-x-1.5 gap-y-1 font-mono text-[11px] text-[#666]'>
117+
<div className='flex flex-wrap items-center gap-x-1.5 gap-y-1 font-season text-[11px] text-[#666]'>
118118
{post.tags.map((tag, i) => (
119119
<span key={tag}>
120120
<Link
@@ -142,7 +142,7 @@ export default async function Page({ params }: { params: Promise<{ slug: string
142142
</div>
143143
</div>
144144
<div className='mt-16 flex items-center justify-between border-t border-[#2A2A2A] pt-8'>
145-
<div className='font-mono text-[11px] text-[#999]'>Share this entry:</div>
145+
<div className='font-season text-[11px] text-[#999]'>Share this entry:</div>
146146
<ShareButtons url={shareUrl} title={post.title} />
147147
</div>
148148
</div>

‎apps/sim/app/(landing)/studio/[slug]/table-of-contents.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,11 +77,11 @@ export function TableOfContents({ headings }: TableOfContentsProps) {
7777

7878
return (
7979
<div>
80-
<div className='mb-4 flex items-center gap-2 border-b border-[#2A2A2A] pb-3 font-mono text-[11px] uppercase tracking-widest text-[#ECECEC]'>
80+
<div className='mb-4 flex items-center gap-2 border-b border-[#2A2A2A] pb-3 font-season text-[11px] uppercase tracking-widest text-[#ECECEC]'>
8181
<List className='h-3 w-3 text-[#2ABBF8]' aria-hidden />
8282
Contents
8383
</div>
84-
<nav className='relative flex flex-col space-y-1 font-mono text-[12px] font-medium text-[#999]'>
84+
<nav className='relative flex flex-col space-y-1 font-season text-[12px] font-medium text-[#999]'>
8585
{headings.map((h, idx) => {
8686
const isActive = activeId === h.id
8787

‎apps/sim/app/(landing)/studio/authors/[id]/page.tsx‎

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,32 +7,39 @@ import { WithSidebar } from '@/app/(landing)/studio/with-sidebar'
77

88
export const revalidate = 3600
99

10+
function findAuthorById(posts: Awaited<ReturnType<typeof getAllPostMeta>>, id: string) {
11+
for (const p of posts) {
12+
if (p.author.id === id) return p.author
13+
const coAuthor = p.authors?.find((a) => a.id === id)
14+
if (coAuthor) return coAuthor
15+
}
16+
return null
17+
}
18+
1019
export async function generateMetadata({
1120
params,
1221
}: {
1322
params: Promise<{ id: string }>
1423
}): Promise<Metadata> {
1524
const { id } = await params
16-
const posts = (await getAllPostMeta()).filter(
17-
(p) => p.author.id === id || p.authors?.some((a) => a.id === id)
18-
)
19-
const author = posts[0]?.author
25+
const allPosts = await getAllPostMeta()
26+
const author = findAuthorById(allPosts, id)
2027
return { title: author?.name ?? 'Author' }
2128
}
2229

2330
export default async function AuthorPage({ params }: { params: Promise<{ id: string }> }) {
2431
const { id } = await params
2532
const allPosts = await getAllPostMeta()
2633
const posts = allPosts.filter((p) => p.author.id === id || p.authors?.some((a) => a.id === id))
27-
const author = posts[0]?.author
34+
const author = findAuthorById(allPosts, id)
2835

2936
if (!author) {
3037
return (
3138
<div className='mx-auto max-w-5xl px-8 py-16 lg:px-12'>
3239
<h1 className='font-[500] text-[32px] text-[#ECECEC]'>Author not found</h1>
3340
<Link
3441
href='/studio'
35-
className='mt-4 inline-block font-mono text-[12px] uppercase tracking-wider text-[#999] transition-colors hover:text-[#ECECEC]'
42+
className='mt-4 inline-block font-season text-[12px] uppercase tracking-wider text-[#999] transition-colors hover:text-[#ECECEC]'
3643
>
3744
Back to all posts
3845
</Link>
@@ -73,7 +80,7 @@ export default async function AuthorPage({ params }: { params: Promise<{ id: str
7380
</div>
7481
)}
7582
<div>
76-
<div className='mb-1 font-mono text-[10px] uppercase tracking-widest text-[#FA4EDF]'>
83+
<div className='mb-1 font-season text-[10px] uppercase tracking-widest text-[#FA4EDF]'>
7784
Author
7885
</div>
7986
<h1 className='font-[500] text-[32px] leading-tight tracking-[-0.02em] text-[#ECECEC]'>
@@ -84,14 +91,14 @@ export default async function AuthorPage({ params }: { params: Promise<{ id: str
8491
href={author.url}
8592
target='_blank'
8693
rel='noopener noreferrer'
87-
className='font-mono text-[11px] text-[#999] transition-colors hover:text-[#ECECEC]'
94+
className='font-season text-[11px] text-[#999] transition-colors hover:text-[#ECECEC]'
8895
>
8996
{author.xHandle ? `@${author.xHandle}` : 'Profile'}
9097
</Link>
9198
)}
9299
</div>
93100
</div>
94-
<h2 className='mb-8 flex items-center gap-2 font-mono text-[11px] uppercase tracking-widest text-[#666]'>
101+
<h2 className='mb-8 flex items-center gap-2 font-season text-[11px] uppercase tracking-widest text-[#666]'>
95102
<span className='inline-block h-2 w-2 bg-[#00F701]' aria-hidden='true' />
96103
Posts by {author.name}
97104
</h2>

‎apps/sim/app/(landing)/studio/category-list.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ export function CategoryList({ items, activeId }: CategoryListProps) {
8383
>
8484
<span className='relative z-10'>{item.label}</span>
8585
<span
86-
className='relative z-10 font-mono text-[10px]'
86+
className='relative z-10 font-season text-[10px]'
8787
style={{
8888
padding: '2px 6px',
8989
borderRadius: '2px',

‎apps/sim/app/(landing)/studio/hero.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export function StudioHero() {
4646
<div className='flex flex-col items-start'>
4747
<motion.div
4848
variants={itemVariants}
49-
className='mb-6 inline-flex items-center gap-2 font-mono text-[11px] uppercase tracking-widest text-[#999]'
49+
className='mb-6 inline-flex items-center gap-2 font-season text-[11px] uppercase tracking-widest text-[#999]'
5050
>
5151
<span className='inline-block h-2 w-2 flex-shrink-0 bg-[#2ABBF8]' aria-hidden='true' />
5252
Sim / Studio

‎apps/sim/app/(landing)/studio/layout.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
import type { Metadata } from 'next'
2+
import { martianMono } from '@/app/_styles/fonts/martian-mono/martian-mono'
3+
import { season } from '@/app/_styles/fonts/season/season'
24
import Footer from '@/app/(home)/components/footer/footer'
35
import Navbar from '@/app/(home)/components/navbar/navbar'
6+
import '@/app/(landing)/studio/studio-scrollbar.css'
47

58
export const metadata: Metadata = {
69
title: {
@@ -32,7 +35,9 @@ export default function StudioLayout({ children }: { children: React.ReactNode }
3235
}
3336

3437
return (
35-
<div className='flex min-h-screen flex-col bg-[#1C1C1C] font-[430] font-season text-[#ECECEC]'>
38+
<div
39+
className={`${season.variable} ${martianMono.variable} studio-scroll flex min-h-screen flex-col bg-[#1C1C1C] font-[430] font-season text-[#ECECEC]`}
40+
>
3641
<script
3742
type='application/ld+json'
3843
dangerouslySetInnerHTML={{ __html: JSON.stringify(orgJsonLd) }}

‎apps/sim/app/(landing)/studio/og/route.tsx‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,11 +40,17 @@ export async function GET(request: NextRequest) {
4040
const authors = post.authors && post.authors.length > 0 ? post.authors : [post.author]
4141
const authorNames = authors.map((a) => a.name).join(', ')
4242

43-
const fontsDir = path.join(process.cwd(), 'app', '_styles', 'fonts', 'season')
44-
const [fontMedium, fontBold] = await Promise.all([
45-
fs.readFile(path.join(fontsDir, 'SeasonSans-Medium.woff')),
46-
fs.readFile(path.join(fontsDir, 'SeasonSans-Bold.woff')),
47-
])
43+
let fontMedium: Buffer
44+
let fontBold: Buffer
45+
try {
46+
const fontsDir = path.join(process.cwd(), 'app', '_styles', 'fonts', 'season')
47+
;[fontMedium, fontBold] = await Promise.all([
48+
fs.readFile(path.join(fontsDir, 'SeasonSans-Medium.woff')),
49+
fs.readFile(path.join(fontsDir, 'SeasonSans-Bold.woff')),
50+
])
51+
} catch {
52+
return new Response('Font assets not found', { status: 500 })
53+
}
4854

4955
const COLORS = ['#2ABBF8', '#FA4EDF', '#FFCC02', '#00F701'] as const
5056

0 commit comments

Comments
 (0)