feat: results

jina-ai · Sep 10, 2021 · 9ffcbc7 · 9ffcbc7
1 parent 630d495
commit 9ffcbc7
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 8 deletions.
diff --git a/packages/showcases/src/components/Results/Results.tsx b/packages/showcases/src/components/Results/Results.tsx
@@ -96,15 +96,15 @@ export const Results = ({
                 select={setSelectedIndex}
             />
             <div className="mb-2 pt-3 font-semibold text-xl flex flex-row items-center">
-                <div className="flex-1">Results</div>
+                <div className="flex-1"></div>
                 <ViewSelector current={view} type="list" select={setView}/>
                 <ViewSelector current={view} type="grid" select={setView}/>
             </div>
 
             {hasResults ? (
                 <ResultsView results={selectedResults} view={view} CustomResultItem={CustomResultItem}/>
             ) : (
-                "Search for something"
+                <></>
             )}
         </div>
     );

diff --git a/packages/showcases/src/pages/NoSSR/pdf.tsx b/packages/showcases/src/pages/NoSSR/pdf.tsx
@@ -78,11 +78,17 @@ export default function PDF() {
     const [searching, setSearching] = useState(false);
     const [viewedPDF, setViewedPDF] = useState<string>("")
     const [viewedPDFName, setViewedPDFName] = useState<string>("")
-
+    const [searchedDocumentName, setSearchedDocumentName] = useState<string>("")
     const jinaClient = new JinaClient(PDF_API_URL, customReqSerializer, customResSerializer)
 
     async function search(...documents: RawDocumentData[]) {
         setSearching(true);
+        if(typeof documents[0] === "string"){
+            setSearchedDocumentName(documents[0])
+        }
+        else{
+            setSearchedDocumentName(documents[0].name)
+        }
         const {results, queries} = await jinaClient.search(...documents)
         setSearching(false);
         setResults(results);
@@ -105,15 +111,15 @@ export default function PDF() {
 
 
         return (
-            <div className="customResultItem">
+            <div className="customResultItem mb-3">
                 <style jsx>
                     {`
                       .thumpnail-hovered:hover {
                         filter: brightness(60%);
                       }
 
                       .customResultItem {
-                        width: 40rem;
+                        width: 30rem;
                       }
                     `}
                 </style>
@@ -147,7 +153,7 @@ export default function PDF() {
     }
 
     return (
-        <>
+        <div className="max-w-screen-2xl">
             <Modal
                 isOpen={modalIsOpen}
                 onRequestClose={closeModal}
@@ -181,7 +187,11 @@ export default function PDF() {
                 </div>
             </Modal>
             <SearchBar searching={searching} search={search}/>
-            <Results results={results} CustomResultItem={CustomResultItem}/>
+            <div className="border-b-2 border-t-2 py-8 mt-6">
+                <p className="font-semibold">Results for: <span className="text-xl">{searchedDocumentName}</span></p>
+            </div>
+                <Results results={results} CustomResultItem={CustomResultItem}/>
+
             <FlowDiagram/>
-        </>)
+        </div>)
 }