Remove organization switcher from side bar #9

Merged
nabarun merged 6 commits from remove-org into main 2024-10-22 10:16:37 +00:00
4 changed files with 28 additions and 19 deletions
Showing only changes of commit 7504b3848d - Show all commits

View File

@ -1,16 +1,23 @@
import { Link } from 'react-router-dom';
import { Heading } from './shared/Heading'; import { Heading } from './shared/Heading';
export const Logo = () => { interface LogoProps {
orgSlug?: string;
}
export const Logo = ({ orgSlug }: LogoProps) => {
return ( return (
<div className="flex items-center gap-3 px-0 lg:px-2"> <Link to={`/${orgSlug}`}>
<img <div className="flex items-center gap-3 px-0 lg:px-2">
src="/logo.svg" <img
alt="Snowball Logo" src="/logo.svg"
className="lg:h-10 lg:w-10 h-8 w-8 rounded-lg" alt="Snowball Logo"
/> className="lg:h-10 lg:w-10 h-8 w-8 rounded-lg"
<Heading className="lg:text-[24px] text-[19px] font-semibold"> />
Snowball <Heading className="lg:text-[24px] text-[19px] font-semibold">
</Heading> Snowball
</div> </Heading>
</div>
</Link>
); );
}; };

View File

@ -117,8 +117,8 @@ export const DeploymentMenu = ({
const deleteDeployment = async () => { const deleteDeployment = async () => {
toast({ toast({
id: 'deployment_going_to_be_deleted', id: 'deleting_deployment',
title: 'Deployment going to be deleted', title: 'Deleting deployment....',
variant: 'success', variant: 'success',
onDismiss: dismiss, onDismiss: dismiss,
}); });
@ -127,8 +127,8 @@ export const DeploymentMenu = ({
if (isDeleted) { if (isDeleted) {
await onUpdate(); await onUpdate();
toast({ toast({
id: 'deployment_deleted', id: 'deployment_removal_requested',
title: 'Deployment deleted', title: 'Deployment removal requested',
variant: 'success', variant: 'success',
onDismiss: dismiss, onDismiss: dismiss,
}); });

View File

@ -1,5 +1,5 @@
import { useCallback, useEffect, useState } from 'react'; import { useCallback, useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom'; import { useNavigate, useParams } from 'react-router-dom';
import { User } from 'gql-client'; import { User } from 'gql-client';
import { motion } from 'framer-motion'; import { motion } from 'framer-motion';
import { useDisconnect } from 'wagmi'; import { useDisconnect } from 'wagmi';
@ -26,6 +26,7 @@ interface SidebarProps {
} }
export const Sidebar = ({ mobileOpen }: SidebarProps) => { export const Sidebar = ({ mobileOpen }: SidebarProps) => {
const { orgSlug } = useParams();
const navigate = useNavigate(); const navigate = useNavigate();
const client = useGQLClient(); const client = useGQLClient();
const isDesktop = useMediaQuery('(min-width: 960px)'); const isDesktop = useMediaQuery('(min-width: 960px)');
@ -72,7 +73,7 @@ export const Sidebar = ({ mobileOpen }: SidebarProps) => {
> >
{/* Logo */} {/* Logo */}
<div className="hidden lg:flex"> <div className="hidden lg:flex">
<Logo /> <Logo orgSlug={orgSlug} />
</div> </div>
{/* This element ensures the space between logo and navigation */} {/* This element ensures the space between logo and navigation */}
<div className="flex-1"></div> <div className="flex-1"></div>

View File

@ -9,7 +9,7 @@ import {
import { Sidebar } from 'components/shared/Sidebar'; import { Sidebar } from 'components/shared/Sidebar';
import { OctokitProvider } from 'context/OctokitContext'; import { OctokitProvider } from 'context/OctokitContext';
import { ComponentPropsWithoutRef, useEffect, useState } from 'react'; import { ComponentPropsWithoutRef, useEffect, useState } from 'react';
import { Outlet } from 'react-router-dom'; import { Outlet, useParams } from 'react-router-dom';
import { AnimatePresence, motion } from 'framer-motion'; import { AnimatePresence, motion } from 'framer-motion';
import { cn } from 'utils/classnames'; import { cn } from 'utils/classnames';
import { useMediaQuery } from 'usehooks-ts'; import { useMediaQuery } from 'usehooks-ts';
@ -22,6 +22,7 @@ export const DashboardLayout = ({
className, className,
...props ...props
}: DashboardLayoutProps) => { }: DashboardLayoutProps) => {
const { orgSlug } = useParams();
const isDesktop = useMediaQuery('(min-width: 960px)'); const isDesktop = useMediaQuery('(min-width: 960px)');
const [isSidebarOpen, setIsSidebarOpen] = useState(false); const [isSidebarOpen, setIsSidebarOpen] = useState(false);
@ -44,7 +45,7 @@ export const DashboardLayout = ({
> >
{/* Header on mobile */} {/* Header on mobile */}
<div className="flex lg:hidden items-center px-4 py-2.5 justify-between"> <div className="flex lg:hidden items-center px-4 py-2.5 justify-between">
<Logo /> <Logo orgSlug={orgSlug} />
<div className="flex items-center gap-0.5"> <div className="flex items-center gap-0.5">
<AnimatePresence> <AnimatePresence>
{isSidebarOpen ? ( {isSidebarOpen ? (