| 'use client' | 'use client' | ||||
| import React, { FC } from 'react' | |||||
| import type { FC } from 'react' | |||||
| import React from 'react' | |||||
| import cn from 'classnames' | import cn from 'classnames' | ||||
| import { useTranslation } from 'react-i18next' | import { useTranslation } from 'react-i18next' | ||||
| import type { SiteInfo } from '@/models/share' | |||||
| import Button from '@/app/components/base/button' | |||||
| import { | import { | ||||
| PencilIcon | |||||
| PencilIcon, | |||||
| } from '@heroicons/react/24/solid' | } from '@heroicons/react/24/solid' | ||||
| import s from './style.module.css' | import s from './style.module.css' | ||||
| import type { SiteInfo } from '@/models/share' | |||||
| import Button from '@/app/components/base/button' | |||||
| export const AppInfo: FC<{ siteInfo: SiteInfo }> = ({ siteInfo }) => { | export const AppInfo: FC<{ siteInfo: SiteInfo }> = ({ siteInfo }) => { | ||||
| const { t } = useTranslation() | |||||
| return ( | return ( | ||||
| <div> | <div> | ||||
| <div className='flex items-center py-2 text-xl font-medium text-gray-700 rounded-md'>👏 {t('share.common.welcome')} {siteInfo.title}</div> | |||||
| <div className='flex items-center py-2 text-xl font-medium text-gray-700 rounded-md'>{siteInfo.icon && <span className='mr-2'><em-emoji id={siteInfo.icon} /></span>}{siteInfo.title}</div> | |||||
| <p className='text-sm text-gray-500'>{siteInfo.description}</p> | <p className='text-sm text-gray-500'>{siteInfo.description}</p> | ||||
| </div> | </div> | ||||
| ) | ) | ||||
| </svg> | </svg> | ||||
| ) | ) | ||||
| export const ChatBtn: FC<{ onClick: () => void, className?: string }> = ({ | |||||
| export const ChatBtn: FC<{ onClick: () => void; className?: string }> = ({ | |||||
| className, | className, | ||||
| onClick | |||||
| onClick, | |||||
| }) => { | }) => { | ||||
| const { t } = useTranslation() | const { t } = useTranslation() | ||||
| return ( | return ( | ||||
| <Button | <Button | ||||
| type='primary' | type='primary' | ||||
| className={cn(className, `!p-0 space-x-2 flex items-center ${s.customBtn}`)} | |||||
| className={cn(className, `flex items-center ${s.customBtn} gap-2`)} | |||||
| onClick={onClick}> | onClick={onClick}> | ||||
| <svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"> | |||||
| <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> | |||||
| <path fillRule="evenodd" clipRule="evenodd" d="M18 10.5C18 14.366 14.418 17.5 10 17.5C8.58005 17.506 7.17955 17.1698 5.917 16.52L2 17.5L3.338 14.377C2.493 13.267 2 11.934 2 10.5C2 6.634 5.582 3.5 10 3.5C14.418 3.5 18 6.634 18 10.5ZM7 9.5H5V11.5H7V9.5ZM15 9.5H13V11.5H15V9.5ZM9 9.5H11V11.5H9V9.5Z" fill="white" /> | <path fillRule="evenodd" clipRule="evenodd" d="M18 10.5C18 14.366 14.418 17.5 10 17.5C8.58005 17.506 7.17955 17.1698 5.917 16.52L2 17.5L3.338 14.377C2.493 13.267 2 11.934 2 10.5C2 6.634 5.582 3.5 10 3.5C14.418 3.5 18 6.634 18 10.5ZM7 9.5H5V11.5H7V9.5ZM15 9.5H13V11.5H15V9.5ZM9 9.5H11V11.5H9V9.5Z" fill="white" /> | ||||
| </svg> | </svg> | ||||
| {t('share.chat.startChat')} | {t('share.chat.startChat')} | ||||
| ) | ) | ||||
| } | } | ||||
| export const EditBtn = ({ className, onClick }: { className?: string, onClick: () => void }) => { | |||||
| export const EditBtn = ({ className, onClick }: { className?: string; onClick: () => void }) => { | |||||
| const { t } = useTranslation() | const { t } = useTranslation() | ||||
| return ( | return ( | ||||
| export const FootLogo = () => ( | export const FootLogo = () => ( | ||||
| <div className={s.logo} /> | <div className={s.logo} /> | ||||
| ) | ) | ||||