support open settings and reload actions

-
closes brave/brave-browser#561
closes brave/brave-browser#417

app/actions/tabActions.ts

@@ -28,3 +28,33 @@ export const tabDataChanged: actions.TabDataChanged = (tabId, changeInfo, tab) =
     tab
   }
 }
+
+// /**
+//  * Creates a new tab
+//  * @param {Object} createProperties As per the chrome extension API
+//  * @param {Function} callback The callback function containing the tab ID of the new tab
+//  * @see https://developer.chrome.com/extensions/tabs#method-create
+//  */
+// export const createTab: actions.createTab = (createProperties, callback) => {
+//   return {
+//     type: types.CREATE_TAB,
+//     createProperties,
+//     callback
+//   }
+// }
+
+// /**
+//  * Reloads a tab
+//  * @param {Number} tabId The ID of the tab to reload; defaults to the selected tab of the current window.
+//  * @param {Boolean} bypassCache Whether using any local cache. Default is false.
+//  * @param callback The callback function
+//  * @see https://developer.chrome.com/extensions/tabs#method-reload
+//  */
+// export const reloadTab: actions.reloadTab = (tabId, reloadProperties, callback) => {
+//   return {
+//     type: types.RELOAD_TAB,
+//     tabId,
+//     reloadProperties,
+//     callback
+//   }
+// }

app/components/braveShields/braveShields.tsx

@@ -73,7 +73,7 @@ export default class BraveShields extends React.Component<BraveShieldsProps, {}>
           allowScriptOriginsOnce={actions.allowScriptOriginsOnce}
           changeNoScriptSettings={actions.changeNoScriptSettings}
         />
-        <BraveShieldsFooter />
+        <BraveShieldsFooter tabId={shieldsPanelTabData.id} />
       </div>
     )
   }

app/components/braveShields/braveShieldsFooter.tsx

@@ -4,25 +4,48 @@
 
 import * as React from 'react'
 import { Grid, Column } from 'brave-ui/gridSystem'
-import Anchor from 'brave-ui/anchor'
 import UnstyledButton from 'brave-ui/unstyledButton'
 import { getMessage } from '../../background/api/localeAPI'
 import theme from '../../theme'
+import * as tabsAPI from '../../background/api/tabsAPI'
+
+export interface BraveShieldsStatsProps {
+  tabId: number
+}
+
+export default class BraveShieldsFooter extends React.PureComponent<BraveShieldsStatsProps, {}> {
+  constructor (props: BraveShieldsStatsProps) {
+    super(props)
+    this.openSettings = this.openSettings.bind(this)
+    this.reloadShields = this.reloadShields.bind(this)
+  }
+
+  openSettings () {
+    tabsAPI.createTab({ url: 'chrome://settings' })
+      .catch((err) => console.log(err))
+  }
+
+  reloadShields () {
+    tabsAPI.reloadTab(this.props.tabId, true)
+      .catch((err) => console.log(err))
+  }
 
-export default class BraveShieldsFooter extends React.PureComponent<{}, {}> {
   render () {
     return (
       <Grid id='braveShieldsFooter' theme={theme.braveShieldsFooter}>
         <Column size={9} theme={theme.columnStart}>
-          <Anchor
-            theme={theme.editLink}
-            href='chrome://settings'
-            target='_blank'
+          <UnstyledButton
+            theme={theme.noUserSelect}
+            onClick={this.openSettings}
             text={getMessage('shieldsFooterEditDefault')}
           />
         </Column>
         <Column size={3} theme={theme.columnEnd}>
-          <UnstyledButton theme={theme.noUserSelect} text={getMessage('shieldsFooterReload')} />
+          <UnstyledButton
+            onClick={this.reloadShields}
+            theme={theme.noUserSelect}
+            text={getMessage('shieldsFooterReload')}
+          />
         </Column>
       </Grid>
     )