Nicholai/jan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: drag and drop support image format when model has vision_model attribute (#2237)

Browse Source
This commit is contained in:
Faisal Amir 2024-03-05 13:39:08 +07:00 committed by GitHub
parent e6c10202e0
commit 02013639a4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 30 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/screens/Chat/ChatInput/index.tsx
View File

@ -165,8 +165,7 @@ const ChatInput: React.FC = () => {
if (
fileUpload.length > 0 ||
(activeThread?.assistants[0].tools &&
!activeThread?.assistants[0].tools[0]?.enabled &&
!activeThread?.assistants[0].model.settings.vision_model)
!activeThread?.assistants[0].tools[0]?.enabled)
) {
e.stopPropagation()
} else {
@ -178,8 +177,7 @@ const ChatInput: React.FC = () => {
<TooltipPortal>
{fileUpload.length > 0 ||
(activeThread?.assistants[0].tools &&
!activeThread?.assistants[0].tools[0]?.enabled &&
!activeThread?.assistants[0].model.settings.vision_model && (
!activeThread?.assistants[0].tools[0]?.enabled && (
<TooltipContent side="top" className="max-w-[154px] px-3">
{fileUpload.length !== 0 && (
<span>
@ -205,7 +203,7 @@ const ChatInput: React.FC = () => {
{showAttacmentMenus && (
<div
ref={refAttachmentMenus}
className="absolute bottom-10 right-0 w-36 cursor-pointer rounded-lg border border-border bg-background py-1 shadow"
className="absolute bottom-10 right-0 z-30 w-36 cursor-pointer rounded-lg border border-border bg-background py-1 shadow"
>
<ul>
<li

33
web/screens/Chat/index.tsx
View File

@ -1,7 +1,7 @@
/* eslint-disable @typescript-eslint/naming-convention */
import React, { useEffect, useState } from 'react'
import { useDropzone } from 'react-dropzone'
import { Accept, useDropzone } from 'react-dropzone'
import { useAtomValue, useSetAtom } from 'jotai'
@ -68,12 +68,22 @@ const ChatScreen: React.FC = () => {
const isGeneratingResponse = useAtomValue(isGeneratingResponseAtom)
const acceptedFormat: Accept = activeThread?.assistants[0].model.settings
.vision_model
? {
'application/pdf': ['.pdf'],
'image/jpeg': ['.jpeg'],
'image/png': ['.png'],
'image/jpg': ['.jpg'],
}
: {
'application/pdf': ['.pdf'],
}
const { getRootProps, isDragReject } = useDropzone({
noClick: true,
multiple: false,
accept: {
'application/pdf': ['.pdf'],
},
accept: acceptedFormat,
onDragOver: (e) => {
// Retrieval file drag and drop is experimental feature
@ -164,10 +174,21 @@ const ChatScreen: React.FC = () => {
<div className="mt-4 text-blue-600">
<h6 className="font-bold">
{isDragReject
? 'Currently, we only support 1 attachment at the same time with PDF format'
? `Currently, we only support 1 attachment at the same time with ${
activeThread?.assistants[0].model.settings
.vision_model
? 'PDF, JPEG, JPG, PNG'
: 'PDF'
} format`
: 'Drop file here'}
</h6>
{!isDragReject && <p className="mt-2">(PDF)</p>}
{!isDragReject && (
<p className="mt-2">
{activeThread?.assistants[0].model.settings.vision_model
? 'PDF, JPEG, JPG, PNG'
: 'PDF'}
</p>
)}
</div>
</div>
</div>