Merge pull request #80 from ClusterCockpit/34-52-rework-searchbar

Merge Searchbar Rework

web/frontend/src/Header.svelte

@@ -1,7 +1,7 @@
 <script>
     import { Icon, Button, InputGroup, Input, Collapse,
              Navbar, NavbarBrand, Nav, NavItem, NavLink, NavbarToggler,
-             Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'sveltestrap'
+             Dropdown, DropdownToggle, DropdownMenu, DropdownItem, InputGroupText } from 'sveltestrap'
 
     export let username // empty string if auth. is disabled, otherwise the username as string
     export let isAdmin  // boolean
@@ -55,8 +55,9 @@
     <div class="d-flex">
         <form method="GET" action="/search">
             <InputGroup>
-                <Input type="text" placeholder={isAdmin ? "Search jobId / username" : "Search jobId"} name="searchId"/>
+                <Input type="text" placeholder="Search 'type:<query>' ..." name="searchId"/>
                 <Button outline type="submit"><Icon name="search"/></Button>
+                <InputGroupText style="cursor:help;" title={isAdmin ? "Example: 'projectId:a100cd', Types are: jobId | jobName | projectId | username" : "Example: 'jobName:myjob', Types are jobId | jobName"}><Icon name="info-circle"/></InputGroupText>
             </InputGroup>
         </form>
         {#if username}

web/frontend/src/filters/Filters.svelte

@@ -45,6 +45,7 @@
         arrayJobId: filterPresets.arrayJobId || null,
         user:       filterPresets.user       || '',
         project:    filterPresets.project    || '',
+        jobName:    filterPresets.jobName    || '',
 
         numNodes:         filterPresets.numNodes         || { from: null, to: null },
         numHWThreads:     filterPresets.numHWThreads     || { from: null, to: null },
@@ -94,6 +95,8 @@
             items.push({ user: { [filters.userMatch]: filters.user } })
         if (filters.project)
             items.push({ project: { [filters.projectMatch]: filters.project } })
+        if (filters.jobName)
+            items.push({ jobName: { contains: filters.jobName } })
         for (let stat of filters.stats)
             items.push({ [stat.field]: { from: stat.from, to: stat.to } })
 
@@ -115,7 +118,7 @@
                 opts.push(`state=${state}`)
         if (filters.startTime.from && filters.startTime.to)
             opts.push(`startTime=${dateToUnixEpoch(filters.startTime.from)}-${dateToUnixEpoch(filters.startTime.to)}`)
-        for (let tag of filters.tags)  
+        for (let tag of filters.tags)
             opts.push(`tag=${tag}`)
         if (filters.duration.from && filters.duration.to)
             opts.push(`duration=${filters.duration.from}-${filters.duration.to}`)
@@ -129,6 +132,8 @@
             opts.push(`userMatch=${filters.userMatch}`)
         if (filters.project)
             opts.push(`project=${filters.project}`)
+        if (filters.jobName)
+            opts.push(`jobName=${filters.jobName}`)
         if (filters.projectMatch != 'contains')
             opts.push(`projectMatch=${filters.projectMatch}`)
 

web/frontend/src/joblist/JobList.svelte

@@ -32,7 +32,7 @@
     query($filter: [JobFilter!]!, $sorting: OrderByInput!, $paging: PageRequest! ){
         jobs(filter: $filter, order: $sorting, page: $paging) {
             items {
-                id, jobId, user, project, cluster, subCluster, startTime,
+                id, jobId, user, project, jobName, cluster, subCluster, startTime,
                 duration, numNodes, numHWThreads, numAcc, walltime,
                 SMT, exclusive, partition, arrayJobId,
                 monitoringStatus, state,