Files
supabase/apps/studio/components/layouts/ProjectLayout/LayoutHeader/HomeIcon.tsx
T
Francesco Sansalvadore b997b7fb13 feat(studio): org project branch mobile selector (#43238)
- add new
[OrgSelector](https://github.com/supabase/supabase/pull/43238/changes#diff-214b339101a9c06864ea2755ac7246eb4c971ce74c5d3169b1385a28ee1d4227)
and
[ProjectBranchSelector](https://github.com/supabase/supabase/pull/43238/changes#diff-82d25c128c306b61bea7481026f58f670a229874f23ca3a1a1d78ddeabde21e0)
components to the mobile navigation, replacing the previous which took
up a lot of horizontal space
- org/project/branch dropdowns now open up in the bottom MobileSheetNav
for a better mobile ux
- desktop nav remains unchanged
2026-03-11 16:25:22 +01:00

42 lines
1.5 KiB
TypeScript

import { LOCAL_STORAGE_KEYS } from 'common'
import { useOrganizationsQuery } from 'data/organizations/organizations-query'
import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
import { useLocalStorageQuery } from 'hooks/misc/useLocalStorage'
import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
import { IS_PLATFORM } from 'lib/constants'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { cn } from 'ui'
export const HomeIcon = ({ className }: { className?: string }) => {
const { data: selectedOrganization } = useSelectedOrganizationQuery()
const { data: organizations } = useOrganizationsQuery()
const largeLogo = useIsFeatureEnabled('branding:large_logo')
const router = useRouter()
const [lastVisitedOrganization] = useLocalStorageQuery(
LOCAL_STORAGE_KEYS.LAST_VISITED_ORGANIZATION,
''
)
const getDefaultOrgRedirect = () => {
if (lastVisitedOrganization) return `/org/${lastVisitedOrganization}`
if (selectedOrganization?.slug) return `/org/${selectedOrganization.slug}`
if (organizations && organizations.length > 0) return `/org/${organizations[0].slug}`
return '/organizations'
}
const href = IS_PLATFORM ? getDefaultOrgRedirect() : '/project/default'
return (
<Link href={href} className={cn('items-center justify-center flex-shrink-0 flex', className)}>
<img
alt="Supabase"
src={`${router.basePath}/img/supabase-logo.svg`}
className={largeLogo ? 'h-[20px]' : 'h-[18px]'}
/>
</Link>
)
}