| const [published, setPublished] = useState(false) | const [published, setPublished] = useState(false) | ||||
| const [open, setOpen] = useState(false) | const [open, setOpen] = useState(false) | ||||
| const appDetail = useAppStore(state => state.appDetail) | const appDetail = useAppStore(state => state.appDetail) | ||||
| const [publishedTime, setPublishedTime] = useState<number | undefined>(publishedAt) | |||||
| const { app_base_url: appBaseURL = '', access_token: accessToken = '' } = appDetail?.site ?? {} | const { app_base_url: appBaseURL = '', access_token: accessToken = '' } = appDetail?.site ?? {} | ||||
| const appMode = (appDetail?.mode !== 'completion' && appDetail?.mode !== 'workflow') ? 'chat' : appDetail.mode | const appMode = (appDetail?.mode !== 'completion' && appDetail?.mode !== 'workflow') ? 'chat' : appDetail.mode | ||||
| const appURL = `${appBaseURL}/${appMode}/${accessToken}` | const appURL = `${appBaseURL}/${appMode}/${accessToken}` | ||||
| try { | try { | ||||
| await onPublish?.(modelAndParameter) | await onPublish?.(modelAndParameter) | ||||
| setPublished(true) | setPublished(true) | ||||
| setPublishedTime(Date.now()) | |||||
| } | } | ||||
| catch (e) { | catch (e) { | ||||
| setPublished(false) | setPublished(false) | ||||
| <div className='w-[336px] bg-white rounded-2xl border-[0.5px] border-gray-200 shadow-xl'> | <div className='w-[336px] bg-white rounded-2xl border-[0.5px] border-gray-200 shadow-xl'> | ||||
| <div className='p-4 pt-3'> | <div className='p-4 pt-3'> | ||||
| <div className='flex items-center h-6 text-xs font-medium text-gray-500 uppercase'> | <div className='flex items-center h-6 text-xs font-medium text-gray-500 uppercase'> | ||||
| {publishedAt ? t('workflow.common.latestPublished') : t('workflow.common.currentDraftUnpublished')} | |||||
| {publishedTime ? t('workflow.common.latestPublished') : t('workflow.common.currentDraftUnpublished')} | |||||
| </div> | </div> | ||||
| {publishedAt | |||||
| {publishedTime | |||||
| ? ( | ? ( | ||||
| <div className='flex justify-between items-center h-[18px]'> | <div className='flex justify-between items-center h-[18px]'> | ||||
| <div className='flex items-center mt-[3px] mb-[3px] leading-[18px] text-[13px] font-medium text-gray-700'> | <div className='flex items-center mt-[3px] mb-[3px] leading-[18px] text-[13px] font-medium text-gray-700'> | ||||
| {t('workflow.common.publishedAt')} {formatTimeFromNow(publishedAt)} | |||||
| {t('workflow.common.publishedAt')} {formatTimeFromNow(publishedTime)} | |||||
| </div> | </div> | ||||
| <Button | <Button | ||||
| className={` | className={` | ||||
| { | { | ||||
| published | published | ||||
| ? t('workflow.common.published') | ? t('workflow.common.published') | ||||
| : publishedAt ? t('workflow.common.update') : t('workflow.common.publish') | |||||
| : publishedTime ? t('workflow.common.update') : t('workflow.common.publish') | |||||
| } | } | ||||
| </Button> | </Button> | ||||
| ) | ) | ||||
| } | } | ||||
| </div> | </div> | ||||
| <div className='p-4 pt-3 border-t-[0.5px] border-t-black/5'> | <div className='p-4 pt-3 border-t-[0.5px] border-t-black/5'> | ||||
| <SuggestedAction disabled={!publishedAt} link={appURL} icon={<PlayCircle />}>{t('workflow.common.runApp')}</SuggestedAction> | |||||
| <SuggestedAction disabled={!publishedTime} link={appURL} icon={<PlayCircle />}>{t('workflow.common.runApp')}</SuggestedAction> | |||||
| {appDetail?.mode === 'workflow' | {appDetail?.mode === 'workflow' | ||||
| ? ( | ? ( | ||||
| <SuggestedAction | <SuggestedAction | ||||
| disabled={!publishedAt} | |||||
| disabled={!publishedTime} | |||||
| link={`${appURL}${appURL.includes('?') ? '&' : '?'}mode=batch`} | link={`${appURL}${appURL.includes('?') ? '&' : '?'}mode=batch`} | ||||
| icon={<LeftIndent02 className='w-4 h-4' />} | icon={<LeftIndent02 className='w-4 h-4' />} | ||||
| > | > | ||||
| setEmbeddingModalOpen(true) | setEmbeddingModalOpen(true) | ||||
| handleTrigger() | handleTrigger() | ||||
| }} | }} | ||||
| disabled={!publishedAt} | |||||
| disabled={!publishedTime} | |||||
| icon={<CodeBrowser className='w-4 h-4' />} | icon={<CodeBrowser className='w-4 h-4' />} | ||||
| > | > | ||||
| {t('workflow.common.embedIntoSite')} | {t('workflow.common.embedIntoSite')} | ||||
| </SuggestedAction> | </SuggestedAction> | ||||
| )} | )} | ||||
| <SuggestedAction disabled={!publishedAt} link='./develop' icon={<FileText className='w-4 h-4' />}>{t('workflow.common.accessAPIReference')}</SuggestedAction> | |||||
| <SuggestedAction disabled={!publishedTime} link='./develop' icon={<FileText className='w-4 h-4' />}>{t('workflow.common.accessAPIReference')}</SuggestedAction> | |||||
| {appDetail?.mode === 'workflow' && ( | {appDetail?.mode === 'workflow' && ( | ||||
| <WorkflowToolConfigureButton | <WorkflowToolConfigureButton | ||||
| disabled={!publishedAt} | |||||
| disabled={!publishedTime} | |||||
| published={!!toolPublished} | published={!!toolPublished} | ||||
| detailNeedUpdate={!!toolPublished && published} | detailNeedUpdate={!!toolPublished && published} | ||||
| workflowAppId={appDetail?.id} | workflowAppId={appDetail?.id} |