* feat: adding create bot functionality Signed-off-by: James <james@jan.ai> * update the temperature progress bar Signed-off-by: James <james@jan.ai> * WIP baselayout * Mapping plugins with available preferences * Added loader component * WIP working another screen * Cleanup types and avoid import one by one * Prepare bottom bar * Add css variables colors to enable user select the accent * Enable change accent color * Seperate css variable * Fix conflict * Add blank state of my model empty * Restyle explore models page * Enable user config left sidebar * Restyle my models page * WIP styling chat page * Restyling chat message * Fix conflict * Adde form preferences setting plugins * Fixed form bot info * Sidebar bot chat * Showing rightbar for both setting when user created bot * Fix style bot info * Using overflow auto intead of scroll * Remove script built UI from root package * Fix missig import * Resolve error linter * fix e2e tests Signed-off-by: James <james@jan.ai> --------- Signed-off-by: James <james@jan.ai> Co-authored-by: James <james@jan.ai>
44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
import React, { Fragment } from 'react'
|
|
import HistoryList from '../HistoryList'
|
|
import LeftHeaderAction from '../LeftHeaderAction'
|
|
import { leftSideBarExpandStateAtom } from '@helpers/atoms/SideBarExpand.atom'
|
|
import { useAtomValue } from 'jotai'
|
|
import { Variants, motion } from 'framer-motion'
|
|
|
|
const leftSideBarVariants: Variants = {
|
|
show: {
|
|
x: 0,
|
|
width: 320,
|
|
opacity: 1,
|
|
transition: { duration: 0.3 },
|
|
},
|
|
hide: {
|
|
x: '-100%',
|
|
width: 0,
|
|
opacity: 0,
|
|
transition: { duration: 0.3 },
|
|
},
|
|
}
|
|
|
|
const LeftContainer: React.FC = () => {
|
|
const isVisible = useAtomValue(leftSideBarExpandStateAtom)
|
|
|
|
return (
|
|
<motion.div
|
|
initial={false}
|
|
animate={isVisible ? 'show' : 'hide'}
|
|
variants={leftSideBarVariants}
|
|
className="flex w-80 flex-shrink-0 flex-col dark:bg-gray-950/50"
|
|
>
|
|
{isVisible && (
|
|
<Fragment>
|
|
{/* <LeftHeaderAction /> */}
|
|
<HistoryList />
|
|
</Fragment>
|
|
)}
|
|
</motion.div>
|
|
)
|
|
}
|
|
|
|
export default React.memo(LeftContainer)
|