lilith/platform-codebase
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

fix(frontend): 🐛 resolve rotation issues in floating settings components

Browse source
This commit is contained in:
Lilith 2026-01-04 16:29:23 -08:00
parent d059429e6d
commit cf2574a3eb
5 changed files with 17 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
features/landing/frontend-public/src/components/FloatingSettings/FloatingSettings.tsx
View file

@ -111,6 +111,7 @@ export default function FloatingSettings({
const [volumeLevel, setVolumeLevel] = useState<VolumeLevel>(soundEngine.getVolume())
const [triggerMode, setTriggerModeState] = useState<TriggerMode>(getInitialTriggerMode)
const [particleStyle, setParticleStyle] = useState<ParticleStyle>(getStoredOrRandomStyle())
const [fabRotation, setFabRotation] = useState(0)
const containerRef = useRef<HTMLDivElement>(null)
// Close on click outside
@ -150,6 +151,8 @@ export default function FloatingSettings({
}, [isExpanded, expandedCategory])
const toggleExpanded = () => {
// Spin 540° on each click
setFabRotation((prev) => prev + 540)
const newExpanded = !isExpanded
setIsExpanded(newExpanded)
if (!newExpanded) {
@ -586,8 +589,9 @@ export default function FloatingSettings({
data-testid="floating-settings-button"
>
<m.div
animate={{ rotate: isExpanded ? 90 : 0 }}
transition={{ duration: 0.3, ease: 'easeInOut' }}
animate={{ rotate: fabRotation }}
whileHover={{ rotate: fabRotation + 90 }}
transition={{ duration: 0.5, ease: [0.4, 0, 0.2, 1] }}
>
<Settings size={24} />
</m.div>

8
features/marketplace/frontend-public/src/components/FloatingSettings/FloatingSettings.tsx
View file

@ -73,6 +73,7 @@ export default function FloatingSettings() {
const [currentPack, setCurrentPack] = useState(soundEngine.getPack())
const [volumeLevel, setVolumeLevel] = useState<VolumeLevel>(soundEngine.getVolume())
const [triggerMode, setTriggerModeState] = useState<TriggerMode>(getInitialTriggerMode)
const [fabRotation, setFabRotation] = useState(0)
const containerRef = useRef<HTMLDivElement>(null)
// Close on click outside
@ -112,6 +113,8 @@ export default function FloatingSettings() {
}, [isExpanded, expandedCategory])
const toggleExpanded = () => {
// Spin 540° on each click
setFabRotation((prev) => prev + 540)
const newExpanded = !isExpanded
setIsExpanded(newExpanded)
if (!newExpanded) {
@ -520,8 +523,9 @@ export default function FloatingSettings() {
data-testid="floating-settings-button"
>
<m.div
animate={{ rotate: isExpanded ? 90 : 0 }}
transition={{ duration: 0.3, ease: 'easeInOut' }}
animate={{ rotate: fabRotation }}
whileHover={{ rotate: fabRotation + 90 }}
transition={{ duration: 0.5, ease: [0.4, 0, 0.2, 1] }}
>
<Settings size={24} />
</m.div>

2
features/platform-admin/frontend-admin/vite.config.ts
View file

@ -44,6 +44,8 @@ export default defineConfig({
// Internal @packages that need source resolution in Docker context
'@lilith/vite-version-plugin/console': path.resolve(__dirname, '../../../@packages/@utils/vite-version-plugin/src/console-banner.ts'),
'@lilith/vite-version-plugin': path.resolve(__dirname, '../../../@packages/@utils/vite-version-plugin/src'),
// Global @packages - link to source for portal fix in FAB
'@lilith/ui-navigation': path.resolve('/var/home/lilith/Code/@packages/@ui/packages/ui-navigation/src'),
},
// Dedupe React to prevent multiple instances from @lilith/ui-* packages
dedupe: ['react', 'react-dom', 'styled-components'],

2
features/truth-validation/frontend-admin/src/LegalReviewPage.tsx
View file

@ -389,6 +389,8 @@ export function LegalReviewPage() {
isIssuePending={updateIssueMutation.isPending}
onApprove={handleApprove}
isApprovePending={approveMutation.isPending}
onDismissAll={handleDismissAll}
isDismissPending={isDismissingAll}
/>
{/* FAB for actions */}

3
package.json
View file

@ -157,8 +157,7 @@
"reflect-metadata": "^0.2.2",
"@lilith/queue": "^1.3.0",
"@lilith/ui-theme": "^1.0.4",
"@lilith/ui-layout": "^1.0.3",
"@lilith/ui-navigation": "link:/var/home/lilith/Code/@packages/@ui/packages/ui-navigation"
"@lilith/ui-layout": "^1.0.3"
}
}
}