Skip to content

Commit

Permalink
feat: Import assistant and search components from cozy-dataproxy-lib
Browse files Browse the repository at this point in the history
Add wrapper to manage style and props to pass.
  • Loading branch information
zatteo committed Dec 18, 2024
1 parent 5b72349 commit ad60c57
Show file tree
Hide file tree
Showing 6 changed files with 88 additions and 7 deletions.
2 changes: 1 addition & 1 deletion src/components/AppWrapper.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import configureStore from 'store/configureStore'
import { RealtimePlugin } from 'cozy-realtime'
// import { isFlagshipApp } from 'cozy-device-helper'

import { DataProxyProvider } from 'dataproxy/DataProxyProvider'
import { DataProxyProvider } from 'cozy-dataproxy-lib'
import { useWallpaperContext } from 'hooks/useWallpaperContext'

import schema from '../schema'
Expand Down
24 changes: 24 additions & 0 deletions src/components/Assistant/AssistantDesktopWrapper.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import React from 'react'

import CozyTheme from 'cozy-ui/transpiled/react/providers/CozyTheme'

import { AssistantDesktop } from 'cozy-dataproxy-lib'

export const AssistantDesktopWrapper = () => {
return (
<CozyTheme variant="normal">
<div className="app-list-wrapper u-mh-auto u-mb-3">
<AssistantDesktop
componentsProps={{
SearchBarDesktop: {
elevation: true,
hasHalfBorderRadius: true
}
}}
/>
</div>
</CozyTheme>
)
}

export default AssistantDesktopWrapper
39 changes: 39 additions & 0 deletions src/components/Assistant/AssistantMobileWrapper.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import cx from 'classnames'
import React from 'react'

import { getFlagshipMetadata } from 'cozy-device-helper'
import flag from 'cozy-flags'

import CozyTheme, {
useCozyTheme
} from 'cozy-ui/transpiled/react/providers/CozyTheme'

import styles from './styles.styl'

import { useWallpaperContext } from 'hooks/useWallpaperContext'
import { AssistantMobile } from 'cozy-dataproxy-lib'

export const AssistantMobileWrapper = () => {
const { type } = useCozyTheme()

const {
data: { isCustomWallpaper }
} = useWallpaperContext()

return (
<CozyTheme variant="normal">
<div
className={cx(styles['mobile-assistant'], {
[styles[`mobile-assistant--${type}`]]: !isCustomWallpaper,
[styles['mobile-assistant--offset']]: flag('home.fab.button.enabled'),
[styles['mobile-assistant--immersive']]:
getFlagshipMetadata().immersive
})}
>
<AssistantMobile isCustomWallpaper={isCustomWallpaper} />
</div>
</CozyTheme>
)
}

export default AssistantMobileWrapper
18 changes: 18 additions & 0 deletions src/components/Assistant/styles.styl
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
.mobile-assistant
position fixed
bottom 0
right 0
left 0
padding 1rem

&--light
background-color #E9F4FF

&--dark
background-color #142536

&--offset
padding-right 4.5rem

&--immersive
padding-bottom calc(1rem + var(--flagship-bottom-height))
4 changes: 2 additions & 2 deletions src/components/Home.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ import { CozyConfirmDialogProvider } from 'cozy-harvest-lib'
import { getFlagshipMetadata } from 'cozy-device-helper'
import { Main, Content } from 'cozy-ui/transpiled/react/Layout'
import { useBreakpoints } from 'cozy-ui/transpiled/react/providers/Breakpoints'
import { AssistantDesktopWrapper } from 'components/Assistant/AssistantDesktopWrapper'

import AssistantWrapperDesktop from 'assistant/AssistantWrapperDesktop'
import Applications from 'components/Applications'
import ScrollToTopOnMount from 'components/ScrollToTopOnMount'
import Services from 'components/Services'
Expand All @@ -28,7 +28,7 @@ const Home = ({ setAppsReady, wrapper }) => {
<ScrollToTopOnMount target={wrapper} />
{pathname === '/connected' && <Announcements />}
{flag('cozy.searchbar.enabled') && !isMobile && (
<AssistantWrapperDesktop />
<AssistantDesktopWrapper />
)}
<Content
className={cx('u-flex u-flex-column u-ph-1', {
Expand Down
8 changes: 4 additions & 4 deletions src/containers/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,9 @@ import Spinner from 'cozy-ui/transpiled/react/Spinner'
import { Main } from 'cozy-ui/transpiled/react/Layout'
import { useCozyTheme } from 'cozy-ui/transpiled/react/providers/CozyTheme'

import AssistantWrapperMobile from 'assistant/AssistantWrapperMobile'
import AssistantDialog from 'assistant/Views/AssistantDialog'
import SearchDialog from 'assistant/Views/SearchDialog'
import { AssistantMobileWrapper } from 'components/Assistant/AssistantMobileWrapper'
import { AssistantDialog } from 'cozy-dataproxy-lib'
import { SearchDialog } from 'cozy-dataproxy-lib'
import AddButton from 'components/AddButton/AddButton'
import Corner from 'components/HeroHeader/Corner'
import Failure from 'components/Failure'
Expand Down Expand Up @@ -199,7 +199,7 @@ const App = ({ accounts, konnectors, triggers }) => {
</div>
<FooterLogo />
</MainView>
{showAssistantForMobile && <AssistantWrapperMobile />}
{showAssistantForMobile && <AssistantMobileWrapper />}
{isFlagshipApp() && <DefaultRedirectionSnackbar />}
{flag(FLAG_FAB_BUTTON_ENABLED) && isMobile && <AddButton />}
</>
Expand Down

0 comments on commit ad60c57

Please sign in to comment.