Skip to content

Commit 1e3fd54

Browse files
chore: fix ci pipeline violations (#640)
* chore: fix ci pipeline violations * ci: apply automated fixes * fix more violations * ci: apply automated fixes * moooaaar * ... more --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
1 parent 7da192b commit 1e3fd54

40 files changed

+214
-133
lines changed

eslint.config.mjs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ export default [
6262
rules: {
6363
...reactHooks.configs.recommended.rules,
6464
...jsxA11y.configs.recommended.rules,
65+
'react-hooks/set-state-in-effect': 'warn',
6566
},
6667
},
6768
]

src/components/AvatarCropModal.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -134,10 +134,14 @@ export function AvatarCropModal({
134134
</div>
135135

136136
<div className="mt-4">
137-
<label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
137+
<label
138+
htmlFor="zoom"
139+
className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2"
140+
>
138141
Zoom
139142
</label>
140143
<input
144+
id="zoom"
141145
type="range"
142146
min={1}
143147
max={3}

src/components/DocsLayout.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react'
2-
import { TextAlignStart, ChevronLeft, ChevronRight, Menu } from 'lucide-react'
2+
import { ChevronLeft, ChevronRight, Menu } from 'lucide-react'
33
import { GithubIcon } from '~/components/icons/GithubIcon'
44
import { DiscordIcon } from '~/components/icons/DiscordIcon'
55
import { Link, useMatches, useParams } from '@tanstack/react-router'
@@ -12,7 +12,7 @@ import { frameworkOptions } from '~/libraries/frameworks'
1212
import { DocsCalloutQueryGG } from '~/components/DocsCalloutQueryGG'
1313
import { twMerge } from 'tailwind-merge'
1414
import { partners, PartnerImage } from '~/utils/partners'
15-
import { GamFooter, GamHeader, GamVrec1 } from './Gam'
15+
import { GamHeader, GamVrec1 } from './Gam'
1616
import { AdGate } from '~/contexts/AdsContext'
1717
import { SearchButton } from './SearchButton'
1818
import { FrameworkSelect, useCurrentFramework } from './FrameworkSelect'
@@ -73,6 +73,7 @@ function MobilePartnersStrip({
7373
}, [isHovered])
7474

7575
return (
76+
// eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events
7677
<div
7778
className="flex-1 flex items-center gap-2 min-w-0"
7879
onClick={(e) => e.preventDefault()}

src/components/FeedEntry.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ interface FeedEntryProps {
4040
}
4141
}
4242

43+
// eslint-disable-next-line @typescript-eslint/no-redeclare
4344
export function FeedEntry({
4445
entry,
4546
showFullContent = false,

src/components/FeedbackModerationTopBar.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -163,10 +163,14 @@ export function FeedbackModerationTopBar({
163163
<FilterDropdownSection title="Date Range">
164164
<div className="space-y-3">
165165
<div>
166-
<label className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1">
166+
<label
167+
htmlFor="from"
168+
className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1"
169+
>
167170
From
168171
</label>
169172
<input
173+
id="from"
170174
type="date"
171175
value={filters.dateFrom || ''}
172176
onChange={(e) =>
@@ -176,10 +180,14 @@ export function FeedbackModerationTopBar({
176180
/>
177181
</div>
178182
<div>
179-
<label className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1">
183+
<label
184+
htmlFor="to"
185+
className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1"
186+
>
180187
To
181188
</label>
182189
<input
190+
id="to"
183191
type="date"
184192
value={filters.dateTo || ''}
185193
onChange={(e) =>

src/components/ImageUpload.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,7 @@ export function ImageUpload({
138138
</button>
139139
</div>
140140
) : (
141+
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
141142
<div
142143
onClick={() => fileInputRef.current?.click()}
143144
onDrop={handleDrop}

src/components/Navbar.tsx

Lines changed: 105 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,95 @@ import {
7373
} from '~/components/Collapsible'
7474
import { Card } from '~/components/Card'
7575

76+
type LogoProps = {
77+
showMenu: boolean
78+
setShowMenu: React.Dispatch<React.SetStateAction<boolean>>
79+
menuButtonRef: React.RefObject<HTMLButtonElement | null>
80+
title?: React.ComponentType<any> | null
81+
}
82+
83+
const LogoSection = ({
84+
showMenu,
85+
setShowMenu,
86+
menuButtonRef,
87+
title,
88+
}: LogoProps) => {
89+
const pointerInsideButtonRef = React.useRef(false)
90+
const toggleMenu = () => {
91+
setShowMenu((prev) => !prev)
92+
}
93+
return (
94+
<>
95+
<button
96+
aria-label="Open Menu"
97+
className={twMerge(
98+
'flex items-center justify-center',
99+
'transition-all duration-300 h-8 px-2 py-1 lg:px-0',
100+
// At lg: only visible when Title exists (flyout mode)
101+
// Below lg: always visible
102+
title
103+
? 'lg:w-9 lg:opacity-100 lg:translate-x-0'
104+
: 'lg:w-0 lg:opacity-0 lg:-translate-x-full',
105+
)}
106+
ref={menuButtonRef}
107+
onClick={toggleMenu}
108+
onPointerEnter={(e) => {
109+
// Enable hover to open flyout at md+ (but not touch)
110+
if (window.innerWidth < 768 || e.pointerType === 'touch') return
111+
if (pointerInsideButtonRef.current) return
112+
pointerInsideButtonRef.current = true
113+
setShowMenu(true)
114+
}}
115+
onPointerLeave={() => {
116+
pointerInsideButtonRef.current = false
117+
}}
118+
>
119+
{showMenu ? <X /> : <Menu />}
120+
</button>
121+
<Link
122+
to="/"
123+
className={twMerge(`inline-flex items-center gap-1.5 cursor-pointer`)}
124+
>
125+
<div className="w-[30px] inline-grid items-center grid-cols-1 grid-rows-1 [&>*]:transition-opacity [&>*]:duration-1000">
126+
<img
127+
src={'/images/logos/logo-color-100.png'}
128+
alt=""
129+
className="row-start-1 col-start-1 w-full group-hover:opacity-0"
130+
/>
131+
<img
132+
src={'/images/logos/logo-black.svg'}
133+
alt=""
134+
className="row-start-1 col-start-1 w-full dark:opacity-0 opacity-0 group-hover:opacity-100"
135+
/>
136+
<img
137+
src={'/images/logos/logo-white.svg'}
138+
alt=""
139+
className="row-start-1 col-start-1 w-full light:opacity-0 dark:block opacity-0 group-hover:opacity-100"
140+
/>
141+
</div>
142+
<div>TanStack</div>
143+
</Link>
144+
</>
145+
)
146+
}
147+
148+
const MobileCard = ({
149+
children,
150+
isActive,
151+
}: {
152+
children: React.ReactNode
153+
isActive?: boolean
154+
}) => (
155+
<Card
156+
className={twMerge(
157+
'md:contents border-gray-200/50 dark:border-gray-700/50 shadow-sm',
158+
isActive && 'ring-2 ring-gray-400/30 dark:ring-gray-500/30',
159+
)}
160+
>
161+
{children}
162+
</Card>
163+
)
164+
76165
export function Navbar({ children }: { children: React.ReactNode }) {
77166
const matches = useMatches()
78167
const capabilities = useCapabilities()
@@ -131,8 +220,6 @@ export function Navbar({ children }: { children: React.ReactNode }) {
131220
}, [])
132221

133222
const [showMenu, setShowMenu] = React.useState(false)
134-
const pointerInsideButtonRef = React.useRef(false)
135-
136223
const largeMenuRef = React.useRef<HTMLDivElement>(null)
137224
const menuButtonRef = React.useRef<HTMLButtonElement>(null)
138225

@@ -143,64 +230,6 @@ export function Navbar({ children }: { children: React.ReactNode }) {
143230
additionalRefs: [largeMenuRef, menuButtonRef],
144231
})
145232

146-
const toggleMenu = () => {
147-
setShowMenu((prev) => !prev)
148-
}
149-
150-
const LogoSection = () => (
151-
<>
152-
<button
153-
aria-label="Open Menu"
154-
className={twMerge(
155-
'flex items-center justify-center',
156-
'transition-all duration-300 h-8 px-2 py-1 lg:px-0',
157-
// At lg: only visible when Title exists (flyout mode)
158-
// Below lg: always visible
159-
Title
160-
? 'lg:w-9 lg:opacity-100 lg:translate-x-0'
161-
: 'lg:w-0 lg:opacity-0 lg:-translate-x-full',
162-
)}
163-
ref={menuButtonRef}
164-
onClick={toggleMenu}
165-
onPointerEnter={(e) => {
166-
// Enable hover to open flyout at md+ (but not touch)
167-
if (window.innerWidth < 768 || e.pointerType === 'touch') return
168-
if (pointerInsideButtonRef.current) return
169-
pointerInsideButtonRef.current = true
170-
setShowMenu(true)
171-
}}
172-
onPointerLeave={() => {
173-
pointerInsideButtonRef.current = false
174-
}}
175-
>
176-
{showMenu ? <X /> : <Menu />}
177-
</button>
178-
<Link
179-
to="/"
180-
className={twMerge(`inline-flex items-center gap-1.5 cursor-pointer`)}
181-
>
182-
<div className="w-[30px] inline-grid items-center grid-cols-1 grid-rows-1 [&>*]:transition-opacity [&>*]:duration-1000">
183-
<img
184-
src={'/images/logos/logo-color-100.png'}
185-
alt=""
186-
className="row-start-1 col-start-1 w-full group-hover:opacity-0"
187-
/>
188-
<img
189-
src={'/images/logos/logo-black.svg'}
190-
alt=""
191-
className="row-start-1 col-start-1 w-full dark:opacity-0 opacity-0 group-hover:opacity-100"
192-
/>
193-
<img
194-
src={'/images/logos/logo-white.svg'}
195-
alt=""
196-
className="row-start-1 col-start-1 w-full light:opacity-0 dark:block opacity-0 group-hover:opacity-100"
197-
/>
198-
</div>
199-
<div>TanStack</div>
200-
</Link>
201-
</>
202-
)
203-
204233
const loginButton = (
205234
<>
206235
{(() => {
@@ -278,11 +307,25 @@ export function Navbar({ children }: { children: React.ReactNode }) {
278307
>
279308
<div className="flex items-center min-w-0">
280309
<div className="flex items-center gap-2 font-black text-xl uppercase min-w-0">
281-
<React.Suspense fallback={<LogoSection />}>
310+
<React.Suspense
311+
fallback={
312+
<LogoSection
313+
menuButtonRef={menuButtonRef}
314+
setShowMenu={setShowMenu}
315+
showMenu={showMenu}
316+
title={Title}
317+
/>
318+
}
319+
>
282320
<LazyBrandContextMenu
283321
className={twMerge(`flex items-center group flex-shrink-0`)}
284322
>
285-
<LogoSection />
323+
<LogoSection
324+
menuButtonRef={menuButtonRef}
325+
setShowMenu={setShowMenu}
326+
showMenu={showMenu}
327+
title={Title}
328+
/>
286329
</LazyBrandContextMenu>
287330
</React.Suspense>
288331
{Title ? (
@@ -318,23 +361,6 @@ export function Navbar({ children }: { children: React.ReactNode }) {
318361

319362
const linkClasses = `flex items-center justify-between gap-2 group px-3 py-3 md:px-2 md:py-1 rounded-lg hover:bg-gray-500/10 font-bold text-base md:text-sm`
320363

321-
const MobileCard = ({
322-
children,
323-
isActive,
324-
}: {
325-
children: React.ReactNode
326-
isActive?: boolean
327-
}) => (
328-
<Card
329-
className={twMerge(
330-
'md:contents border-gray-200/50 dark:border-gray-700/50 shadow-sm',
331-
isActive && 'ring-2 ring-gray-400/30 dark:ring-gray-500/30',
332-
)}
333-
>
334-
{children}
335-
</Card>
336-
)
337-
338364
const items = (
339365
<div className="contents md:block">
340366
<div className="contents md:block">

src/components/NotesModerationTopBar.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -122,10 +122,14 @@ export function NotesModerationTopBar({
122122
<FilterDropdownSection title="Date Range">
123123
<div className="space-y-3">
124124
<div>
125-
<label className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1">
125+
<label
126+
htmlFor="from"
127+
className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1"
128+
>
126129
From
127130
</label>
128131
<input
132+
id="from"
129133
type="date"
130134
value={filters.dateFrom || ''}
131135
onChange={(e) =>
@@ -135,10 +139,14 @@ export function NotesModerationTopBar({
135139
/>
136140
</div>
137141
<div>
138-
<label className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1">
142+
<label
143+
htmlFor="to"
144+
className="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1"
145+
>
139146
To
140147
</label>
141148
<input
149+
id="to"
142150
type="date"
143151
value={filters.dateTo || ''}
144152
onChange={(e) =>

src/components/SearchModal.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -189,14 +189,15 @@ function useSearchFilters() {
189189
function SearchFiltersProvider({ children }: { children: React.ReactNode }) {
190190
const userQuery = useCurrentUserQuery()
191191
const [selectedLibrary, setSelectedLibrary] = React.useState('')
192+
const lastUsedFramework = userQuery.data?.lastUsedFramework
192193

193194
// Get initial framework from user preference (DB if logged in, localStorage otherwise)
194195
const getInitialFramework = React.useCallback(() => {
195-
if (userQuery.data?.lastUsedFramework) {
196-
return userQuery.data.lastUsedFramework
196+
if (lastUsedFramework) {
197+
return lastUsedFramework
197198
}
198199
return getStoredFrameworkPreference() || ''
199-
}, [userQuery.data?.lastUsedFramework])
200+
}, [lastUsedFramework])
200201

201202
const [selectedFramework, setSelectedFramework] =
202203
React.useState(getInitialFramework)

src/components/ShowcaseModerationList.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -522,10 +522,14 @@ export function ShowcaseModerationList({
522522
{/* Moderation Note Input (for pending only) */}
523523
{isPending && (
524524
<div>
525-
<label className="block text-sm font-semibold mb-2">
525+
<label
526+
htmlFor="note"
527+
className="block text-sm font-semibold mb-2"
528+
>
526529
Internal Moderation Note (optional):
527530
</label>
528531
<textarea
532+
id="note"
529533
value={moderationNotes[showcase.id] || ''}
530534
onChange={(e) =>
531535
handleModerationNoteChange(

0 commit comments

Comments
 (0)