Save edited queries on search

src/main/webapp/components/query-manager/query-manager.stories.tsx

@@ -40,6 +40,9 @@ stories.add('Basic', () => {
           action('onSearch')(id)
           setQuery(id)
         }}
+        onSave={id => {
+          action('onSave')(id)
+        }}
         onCreate={() => {
           action('onCreate')
         }}

src/main/webapp/components/query-manager/query-manager.tsx

@@ -122,10 +122,15 @@ const QueryManager = (props: QueryManagerProps) => {
     props.onChange(updatedQueries)
   }
 
+  const onSearch = (id: string) => {
+    props.onSave(id)
+    props.onSearch(id)
+  }
+
   return (
     <React.Fragment>
       <AddQuery {...props} onChange={onChange} />
-      <QuerySelector {...props} onChange={onChange} />
+      <QuerySelector {...props} onChange={onChange} onSearch={onSearch} />
     </React.Fragment>
   )
 }

src/main/webapp/components/query-manager/types.tsx

@@ -32,4 +32,5 @@ export type QueryManagerProps = Overwrite<
   { onChange: (queries: QueryType[]) => void }
 > & {
   onCreate: (query: QueryType) => void
+  onSave: (id: string) => void
 }

src/main/webapp/components/workspace/hooks/index.tsx

@@ -1,2 +1,3 @@
 export { default as useCreateQuery } from './use-create-query'
+export { default as useSaveQuery } from './use-save-query'
 export { default as useSaveWorkspace } from './use-save-workspace'

src/main/webapp/components/workspace/hooks/use-save-query.tsx

@@ -0,0 +1,26 @@
+import { useMutation } from '@apollo/react-hooks'
+import gql from 'graphql-tag'
+import { QueryType } from '../../query-builder/types'
+
+export default () => {
+  const mutation = gql`
+    mutation SaveQuery($id: ID!, $attrs: MetacardAttributesInput!) {
+      saveMetacard(id: $id, attributes: $attrs) {
+        id
+      }
+    }
+  `
+
+  const [save] = useMutation(mutation)
+  return (query: QueryType) => {
+    save({
+      variables: {
+        id: query.id,
+        attrs: {
+          ...query,
+          metacard_type: 'metacard.query',
+        },
+      },
+    })
+  }
+}

src/main/webapp/components/workspace/workspace.js

@@ -15,7 +15,7 @@ import { InlineRetry } from '../network-retry'
 import QueryEditor from '../query-editor'
 import QueryManager from '../query-manager'
 import QueryStatus from '../query-status'
-import { useCreateQuery, useSaveWorkspace } from './hooks'
+import { useCreateQuery, useSaveQuery, useSaveWorkspace } from './hooks'
 
 const LoadingComponent = () => <LinearProgress />
 
@@ -41,6 +41,8 @@ const workspaceById = gql`
           title
           filterTree
           type
+          sorts
+          sources
         }
         lists {
           list_bookmarks
@@ -95,8 +97,10 @@ export default () => {
   const [queries, setQueries] = useState()
   const { results, status, onSearch, onCancel, onClear } = useQueryExecutor()
 
+  const saveQuery = useSaveQuery()
   const saveWorkspace = useSaveWorkspace()
   const createQuery = useCreateQuery(query => {
+    onClear()
     setQueries([query, ...queries])
     setCurrentQuery(query.id)
     saveWorkspace({ queries: [query, ...queries] })
@@ -166,7 +170,6 @@ export default () => {
         {tab === 0 &&
           queries && (
             <React.Fragment>
-              {/* //TODO mutate cache on search so that the queries reflect edits made in queryEditor */}
               <QueryManager
                 QueryEditor={QueryEditor}
                 queries={queries}
@@ -179,6 +182,9 @@ export default () => {
                   )
                 }}
                 onCreate={createQuery}
+                onSave={id => {
+                  saveQuery(queries.find(query => query.id === id))
+                }}
                 onChange={queries => setQueries(queries)}
               />