Browse Source

Fix/footer behavior (#23555)

tags/1.7.2
crazywoola 2 months ago
parent
commit
305ea0a2d5
No account linked to committer's email address

+ 2
- 17
web/app/components/apps/footer.tsx View File

import React, { useState } from 'react'
import React from 'react'
import Link from 'next/link' import Link from 'next/link'
import { RiCloseLine, RiDiscordFill, RiGithubFill } from '@remixicon/react'
import { RiDiscordFill, RiGithubFill } from '@remixicon/react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'


type CustomLinkProps = { type CustomLinkProps = {


const Footer = () => { const Footer = () => {
const { t } = useTranslation() const { t } = useTranslation()
const [isVisible, setIsVisible] = useState(true)

const handleClose = () => {
setIsVisible(false)
}

if (!isVisible)
return null


return ( return (
<footer className='relative shrink-0 grow-0 px-12 py-2'> <footer className='relative shrink-0 grow-0 px-12 py-2'>
<button
onClick={handleClose}
className='absolute right-2 top-2 flex h-6 w-6 cursor-pointer items-center justify-center rounded-full transition-colors duration-200 ease-in-out hover:bg-components-main-nav-nav-button-bg-active'
aria-label="Close footer"
>
<RiCloseLine className='h-4 w-4 text-text-tertiary hover:text-text-secondary' />
</button>
<h3 className='text-gradient text-xl font-semibold leading-tight'>{t('app.join')}</h3> <h3 className='text-gradient text-xl font-semibold leading-tight'>{t('app.join')}</h3>
<p className='system-sm-regular mt-1 text-text-tertiary'>{t('app.communityIntro')}</p> <p className='system-sm-regular mt-1 text-text-tertiary'>{t('app.communityIntro')}</p>
<div className='mt-3 flex items-center gap-2'> <div className='mt-3 flex items-center gap-2'>

+ 0
- 6
web/app/components/apps/index.tsx View File

'use client' 'use client'
import { useEducationInit } from '@/app/education-apply/hooks' import { useEducationInit } from '@/app/education-apply/hooks'
import { useGlobalPublicStore } from '@/context/global-public-context'
import List from './list' import List from './list'
import Footer from './footer'
import useDocumentTitle from '@/hooks/use-document-title' import useDocumentTitle from '@/hooks/use-document-title'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'


const Apps = () => { const Apps = () => {
const { t } = useTranslation() const { t } = useTranslation()
const { systemFeatures } = useGlobalPublicStore()


useDocumentTitle(t('common.menus.apps')) useDocumentTitle(t('common.menus.apps'))
useEducationInit() useEducationInit()
return ( return (
<div className='relative flex h-0 shrink-0 grow flex-col overflow-y-auto bg-background-body'> <div className='relative flex h-0 shrink-0 grow flex-col overflow-y-auto bg-background-body'>
<List /> <List />
{!systemFeatures.branding.enabled && (
<Footer />
)}
</div > </div >
) )
} }

+ 6
- 0
web/app/components/apps/list.tsx View File

import CheckboxWithLabel from '@/app/components/datasets/create/website/base/checkbox-with-label' import CheckboxWithLabel from '@/app/components/datasets/create/website/base/checkbox-with-label'
import dynamic from 'next/dynamic' import dynamic from 'next/dynamic'
import Empty from './empty' import Empty from './empty'
import Footer from './footer'
import { useGlobalPublicStore } from '@/context/global-public-context'


const TagManagementModal = dynamic(() => import('@/app/components/base/tag-management'), { const TagManagementModal = dynamic(() => import('@/app/components/base/tag-management'), {
ssr: false, ssr: false,


const List = () => { const List = () => {
const { t } = useTranslation() const { t } = useTranslation()
const { systemFeatures } = useGlobalPublicStore()
const router = useRouter() const router = useRouter()
const { isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator } = useAppContext() const { isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator } = useAppContext()
const showTagManagementModal = useTagStore(s => s.showTagManagementModal) const showTagManagementModal = useTagStore(s => s.showTagManagementModal)
<span className="system-xs-regular">{t('app.newApp.dropDSLToCreateApp')}</span> <span className="system-xs-regular">{t('app.newApp.dropDSLToCreateApp')}</span>
</div> </div>
)} )}
{!systemFeatures.branding.enabled && (
<Footer />
)}
<CheckModal /> <CheckModal />
<div ref={anchorRef} className='h-0'> </div> <div ref={anchorRef} className='h-0'> </div>
{showTagManagementModal && ( {showTagManagementModal && (

Loading…
Cancel
Save