Use currentUser() rather than API user key for worklog searching

Move action icons to footer to provide a more consistent UX

jira-worklogs.js

@@ -180,7 +180,7 @@ class JiraWorklogs {
   fetchUpdatedTasks(startAt) {
     return new Promise((resolve, reject) => {
       this.sendRequest('/search', 'POST', {
-        jql: `worklogAuthor = ${this.userKey} && worklogDate >= -1w`,
+        jql: `worklogAuthor = currentUser() && worklogDate >= -1w`,
         maxResults: 100,
         fields: ['key', 'summary', 'project']
       })
@@ -204,7 +204,7 @@ class JiraWorklogs {
             let created = parse(worklog.created)
             let ageInDays = differenceInDays(new Date(), created)
 
-            if (worklog.author.key == this.userKey && ageInDays < 5)
+            if (worklog.author.key === this.userKey && ageInDays < 7)
               currentUserWorklogs.push({
                 id: worklog.id,
                 created: worklog.created,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jira-timer",
-  "version": "1.0.24",
+  "version": "1.0.25",
   "description": "Jira Timer",
   "productName": "Jira Timer",
   "main": "index.js",

src/components/header.js

@@ -4,10 +4,9 @@ import { Link } from 'react-router-dom'
 import styled, { css } from 'styled-components'
 import PropTypes from 'prop-types'
 import FontAwesomeIcon from '@fortawesome/react-fontawesome'
-import faCog from '@fortawesome/fontawesome-free-solid/faCog'
 import faAngleLeft from '@fortawesome/fontawesome-free-solid/faAngleLeft'
-import faPlus from '@fortawesome/fontawesome-free-solid/faPlus'
 import faPowerOff from '@fortawesome/fontawesome-free-solid/faPowerOff'
+import faPlus from '@fortawesome/fontawesome-free-solid/faPlus'
 import Button, { ButtonIcon } from './button'
 import IconLink from './icon-link'
 import IconWrap from './icon-wrap'
@@ -22,11 +21,9 @@ class Header extends Component {
   }
 
   render() {
-    let rightAligned = !this.props.withCreateTaskButton && !this.props.withBackButton
-
     return (
       <Fragment>
-        <HeaderStyled rightAligned={rightAligned}>
+        <HeaderStyled>
 
           {this.props.withCreateTaskButton && (
             <Link to="/create-task">
@@ -45,20 +42,13 @@ class Header extends Component {
 
           <Title>{this.props.titleText}</Title>
 
-
-          <IconWrap>
-            {this.props.withQuitButton && (
-              <IconLink to="/dashboard" onClick={this.onQuitApp}>
+          {this.props.withExitButton && (
+            <IconWrap>
+              <IconLink to='/dashboard' onClick={this.onQuitApp}>
                 <FontAwesomeIcon icon={faPowerOff} />
               </IconLink>
-            )}
-
-            {this.props.withSettingsButton && (
-              <IconLink to={this.props.settingsLink}>
-                <FontAwesomeIcon icon={faCog} />
-              </IconLink>
-            )}
-          </IconWrap>
+            </IconWrap>
+          )}
 
         </HeaderStyled>
       </Fragment>
@@ -80,10 +70,6 @@ const HeaderStyled = styled.div`
   padding-right: 10px;
   border-bottom: 1px solid ${props => props.theme.darkMode ? props.theme.dark.border : '#D7D7D7' };
   border-radius: 6px 6px 0 0;
-
-  ${props => (props.rightAligned) && css`
-    flex-direction: row-reverse;
-  `}
 `
 
 const Title = styled.span`

src/components/icon-wrap.js

@@ -2,7 +2,7 @@ import React from 'react'
 import styled, { css } from 'styled-components'
 
 const IconWrap = styled.div`
-  & > :last-child {
+  & > :not(first-child) {
     margin-left: 1em;
   }
 `

src/containers/dashboard/dashboard-container.js

@@ -9,7 +9,6 @@ import FooterContainer from '../footer/footer-container'
 import RecentContainer from '../recent/recent-container'
 import TimerContainer from '../timer/timer-container'
 import UpdateContainer from '../update/update-container'
-import WorklogTotals from '../worklog/worklog-totals'
 import Header from '../../components/header'
 
 class DashboardContainer extends Component {
@@ -28,21 +27,14 @@ class DashboardContainer extends Component {
           titleText="Jira Timer"
           settingsLink="/settings"
           withCreateTaskButton
-          withSettingsButton
         />
 
         <UpdateContainer />
         <TimerContainer />
         <SearchContainer />
         <RecentContainer />
 
-        <FooterContainer>
-          <WorklogTotals />
-
-          <IconLink to="/worklogs">
-            <FontAwesomeIcon icon={faHistory} />
-          </IconLink>
-        </FooterContainer>
+        <FooterContainer />
       </Fragment>
     );
   }

src/containers/footer/footer-container.js

@@ -1,16 +1,37 @@
+
 import React, { Component, Fragment } from 'react'
 import { connect } from 'react-redux'
 import styled from 'styled-components'
+import { withRouter } from 'react-router-dom'
+import FontAwesomeIcon from '@fortawesome/react-fontawesome'
+import faCog from '@fortawesome/fontawesome-free-solid/faCog'
+import faHistory from '@fortawesome/fontawesome-free-solid/faHistory'
+import WorklogTotals from '../worklog/worklog-totals'
+import IconWrap from '../../components/icon-wrap'
+import IconLink from '../../components/icon-link'
 
 class FooterContainer extends Component {
   constructor(props) {
     super(props)
   }
 
   render() {
+    const settingsPath = this.props.location.pathname === '/settings' ? '/dashboard' : '/settings'
+    const worklogsPath = this.props.location.pathname === '/worklogs' ? '/dashboard' : '/worklogs'
+
     return (
       <FooterStyled>
-        {this.props.children}
+        <WorklogTotals />
+
+        <IconWrap>
+          <IconLink to={worklogsPath} title="View worklog history">
+            <FontAwesomeIcon icon={faHistory} />
+          </IconLink>
+
+          <IconLink to={settingsPath} title="Settings">
+            <FontAwesomeIcon icon={faCog} />
+          </IconLink>
+        </IconWrap>
       </FooterStyled>
     )
   }
@@ -33,4 +54,4 @@ const mapStateToProps = state => ({
   authToken: state.user.authToken,
 })
 
-export default connect(mapStateToProps)(FooterContainer)
+export default withRouter(connect(mapStateToProps)(FooterContainer))

src/containers/search/search-container.js

@@ -139,12 +139,18 @@ class SearchContainer extends Component {
       error: false
     })
 
-    // JIRA api throws an error if you attempt a key search with a string
-    // that doesn't have a dash in it
-    let keySearch = query.indexOf("-") > -1
-    let jql = `summary ~ "${query}"`
-    if (keySearch) jql += `OR key = "${query}"`
-    jql += 'order by lastViewed DESC'
+    const keySearch = query.indexOf("-") > -1
+    const jqlSearch = query.indexOf('=') > -1 || query.indexOf('~') > 1
+
+    // Is the user searching with custom JQL syntax?
+    // If not build the JQL for them
+    if (jqlSearch) {
+      jql = query
+    } else {
+      let jql = `summary ~ "${query}"`
+      if (keySearch) jql += `OR key = "${query}"`
+      jql += 'order by updated DESC'
+    }
 
     api.post('/search', {
       jql,

src/containers/settings/settings-container.js

@@ -73,10 +73,8 @@ class SettingsContainer extends Component {
 
         <Header
           titleText="Settings"
-          settingsLink="/dashboard"
           withBackButton
-          withSettingsButton
-          withQuitButton
+          withExitButton
         />
 
         <UpdateContainer />
@@ -150,6 +148,8 @@ class SettingsContainer extends Component {
             </div>
           </FlexContainer>
         </Section>
+
+        <FooterContainer />
       </Page>
     );
   }

src/containers/worklog/worklog-container.js

@@ -146,8 +146,6 @@ class WorklogContainer extends Component {
       <Page>
         <Header
           titleText="Posted Times"
-          settingsLink="/settings"
-          withSettingsButton
           withBackButton
         />
 
@@ -218,7 +216,7 @@ class WorklogContainer extends Component {
 
 const Worklogs = styled.div`
   overflow: auto;
-  max-height: 331px;
+  max-height: 399px;
 `
 
 const WorklogsUpdating = styled.span`