@@ -335,7 +335,7 @@ export const LaunchesComponent = () => {
335335 const t = useT ( ) ;
336336 const [ reload , setReload ] = useState ( false ) ;
337337 const [ collapseMenu , setCollapseMenu ] = useCookie ( 'collapseMenu' , '0' ) ;
338-
338+ const [ mode ] = useCookie ( 'mode' , 'dark' ) ;
339339 const { isLoading, data : integrations , mutate } = useIntegrationList ( ) ;
340340
341341 const totalNonDisabledChannels = useMemo ( ( ) => {
@@ -474,8 +474,13 @@ export const LaunchesComponent = () => {
474474 ) }
475475 >
476476 < div className = "flex items-center" >
477- < h2 className = "group-[.sidebar]:hidden flex-1 text-[20px] font-[500]" > { t ( 'channels' ) } </ h2 >
478- < div onClick = { ( ) => setCollapseMenu ( collapseMenu === '1' ? '0' : '1' ) } className = "group-[.sidebar]:rotate-[180deg] group-[.sidebar]:mx-auto text-btnText bg-btnSimple rounded-[6px] w-[24px] h-[24px] flex items-center justify-center cursor-pointer select-none" >
477+ < h2 className = "group-[.sidebar]:hidden flex-1 text-[20px] font-[500]" >
478+ { t ( 'channels' ) }
479+ </ h2 >
480+ < div
481+ onClick = { ( ) => setCollapseMenu ( collapseMenu === '1' ? '0' : '1' ) }
482+ className = "group-[.sidebar]:rotate-[180deg] group-[.sidebar]:mx-auto text-btnText bg-btnSimple rounded-[6px] w-[24px] h-[24px] flex items-center justify-center cursor-pointer select-none"
483+ >
479484 < svg
480485 xmlns = "http://www.w3.org/2000/svg"
481486 width = "7"
@@ -501,16 +506,27 @@ export const LaunchesComponent = () => {
501506 user ?. tier ?. ai &&
502507 billingEnabled && < GeneratorComponent /> }
503508 </ div >
504- < div className = "mt-[5px]" >
505- { process . env . NEXT_PUBLIC_VERSION
506- ? `${ process . env . NEXT_PUBLIC_VERSION } `
507- : '' }
508- </ div >
509509 </ div >
510510 < div className = "gap-[32px] flex flex-col select-none flex-1" >
511- { sortedIntegrations . length === 0 && (
512- < div className = "text-[12px]" >
513- { t ( 'no_channels' , 'No channels' ) }
511+ { sortedIntegrations . length === 0 && collapseMenu === '0' && (
512+ < div className = "flex-1 justify-center items-center flex" >
513+ < div className = "flex flex-col gap-[12px] text-center" >
514+ < img
515+ src = {
516+ mode === 'dark'
517+ ? '/no-channels.svg'
518+ : '/no-channels-colors.svg'
519+ }
520+ alt = "No channels"
521+ className = "mx-auto min-w-[100%]"
522+ />
523+ < div className = "font-[600] text-[20px]" >
524+ { t ( 'no_channels' , 'No channels yet' ) }
525+ </ div >
526+ < div className = "text-[14px]" >
527+ { t ( 'connect_your_accounts' ) }
528+ </ div >
529+ </ div >
514530 </ div >
515531 ) }
516532 { menuIntegrations . map ( ( menu ) => (
@@ -526,6 +542,11 @@ export const LaunchesComponent = () => {
526542 />
527543 ) ) }
528544 </ div >
545+ < div className = "mt-[5px] text-center" >
546+ { process . env . NEXT_PUBLIC_VERSION
547+ ? process . env . NEXT_PUBLIC_VERSION
548+ : '' }
549+ </ div >
529550 </ div >
530551 < div className = "bg-newBgColorInner flex-1 flex-col flex p-[20px] gap-[12px]" >
531552 < Filters />
0 commit comments