Update toast messages

packages/frontend/src/components/Logo.tsx

@@ -1,7 +1,13 @@
+import { Link } from 'react-router-dom';
 import { Heading } from './shared/Heading';
 
-export const Logo = () => {
+interface LogoProps {
+  orgSlug?: string;
+}
+
+export const Logo = ({ orgSlug }: LogoProps) => {
   return (
+    <Link to={`/${orgSlug}`}>
       <div className="flex items-center gap-3 px-0 lg:px-2">
         <img
           src="/logo.svg"
@@ -12,5 +18,6 @@ export const Logo = () => {
           Snowball
         </Heading>
       </div>
+    </Link>
   );
 };

packages/frontend/src/components/projects/project/deployments/DeploymentMenu.tsx

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

packages/frontend/src/components/shared/Sidebar/Sidebar.tsx

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

packages/frontend/src/pages/org-slug/layout.tsx

@@ -9,7 +9,7 @@ import {
 import { Sidebar } from 'components/shared/Sidebar';
 import { OctokitProvider } from 'context/OctokitContext';
 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 { cn } from 'utils/classnames';
 import { useMediaQuery } from 'usehooks-ts';
@@ -22,6 +22,7 @@ export const DashboardLayout = ({
   className,
   ...props
 }: DashboardLayoutProps) => {
+  const { orgSlug } = useParams();
   const isDesktop = useMediaQuery('(min-width: 960px)');
 
   const [isSidebarOpen, setIsSidebarOpen] = useState(false);
@@ -44,7 +45,7 @@ export const DashboardLayout = ({
       >
         {/* Header on mobile */}
         <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">
             <AnimatePresence>
               {isSidebarOpen ? (