Merge pull request #139 from iomega/example-queries

Example queries
iomega · Apr 21, 2020 · 76e24fe · 76e24fe
2 parents a7c576f + c78ba9d
commit 76e24fe
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 * Added ionization modes to stats page ([#132](https://github.com/iomega/paired-data-form/issues/132))
+* Search query examples ([#132](https://github.com/iomega/paired-data-form/issues/132))
 
 ### Fixed
 

diff --git a/app/src/ProjectList.tsx b/app/src/ProjectList.tsx
@@ -41,7 +41,7 @@ export const ProjectList = ({ projects, setSortedOn, sortedOn }: Props) => {
         </tr>
     ));
     if (projects.length === 0) {
-        rows.push(<tr><td colSpan={9}>No projects found.</td></tr>);
+        rows.push(<tr key="0"><td colSpan={9}>No projects found.</td></tr>);
     }
     return (
         <Table>

diff --git a/app/src/ProjectSearch.tsx b/app/src/ProjectSearch.tsx
@@ -1,7 +1,8 @@
 import * as React from "react";
 
 import { Glyphicon, FormControl, Button, Form, InputGroup } from "react-bootstrap";
-import { useState } from "react";
+import { useState, useEffect } from "react";
+import { Link } from "react-router-dom";
 
 export type FilterKey = 'principal_investigator'
     | 'submitter' | 'genome_type' | 'species'
@@ -22,6 +23,10 @@ interface Props {
 export const ProjectSearch = (props: Props) => {
     const [query, setQuery] = useState<string>(props.query ? props.query : '');
 
+    useEffect(() => {
+        setQuery(props.query ? props.query : '');
+    }, [props.query])
+
     function submitSearch(e: React.FormEvent<Form>) {
         e.preventDefault();
         props.submitSearch(query);
@@ -64,6 +69,41 @@ export const ProjectSearch = (props: Props) => {
                     </Button>
                 </div>
             )}
+            <div>
+                <span>Example search queries: </span>
+                <Link title="Any project which contains Streptomyces, mostly found in a species name or genome label" to={{
+                    pathname: '/projects',
+                    search: `q=Streptomyces`
+                }}>Streptomyces</Link>,&nbsp;
+                <Link title="Any project which contains the biosample identifier" to={{
+                    pathname: '/projects',
+                    search: `q=SAMN02603879`
+                }}>SAMN02603879</Link>,&nbsp;
+                <Link title="Any project which contains a word that starts with scrip" to={{
+                    pathname: '/projects',
+                    search: `q=scrip*`
+                }}>scrip*</Link>,&nbsp;
+                <Link title="Any project which contains tubes or flask" to={{
+                    pathname: '/projects',
+                    search: `q=tubes | flask`
+                }}>tubes | flask</Link>,&nbsp;
+                <Link title="Any project which contains Pieter and Carmen" to={{
+                    pathname: '/projects',
+                    search: `q=Pieter+%2B+Carmen`
+                }}>Pieter + Carmen</Link>,&nbsp;
+                <Link title="Any project which contains Pieter and not Carmen" to={{
+                    pathname: '/projects',
+                    search: `q=Pieter+%2B+-Carmen`
+                }}>Pieter + -Carmen</Link>,&nbsp;
+                <Link title='Any project which contains Pieter and Carmen or Emily' to={{
+                    pathname: '/projects',
+                    search: `q=Pieter %2B (Carmen | Emily)`
+                }}>Pieter + (Carmen | Emily)</Link>,&nbsp;
+                <Link title='Any project which contains Pieter and ' to={{
+                    pathname: '/projects',
+                    search: `q="acetonitrile with"`
+                }}>"acetonitrile with"</Link>
+            </div>
         </Form>
     );
 }