diff --git a/package-lock.json b/package-lock.json
index 246fc2d..fe0b938 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6255,6 +6255,14 @@
"warning": "^4.0.1"
}
},
+ "react-toasts": {
+ "version": "3.0.3",
+ "resolved": "https://registry.npmjs.org/react-toasts/-/react-toasts-3.0.3.tgz",
+ "integrity": "sha512-af85o0jS05A1SuurACOnBSRlLf2krPeXMPXL/67qnB1PjoMI8QjKXdGcxkELeNw1DMp8LVvxqdGnP5jiueTlEg==",
+ "requires": {
+ "watchable-stores": "^2.0.2"
+ }
+ },
"react-transition-group": {
"version": "2.5.2",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.5.2.tgz",
@@ -7749,6 +7757,11 @@
"loose-envify": "^1.0.0"
}
},
+ "watchable-stores": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/watchable-stores/-/watchable-stores-2.0.2.tgz",
+ "integrity": "sha512-xKzypK+hG6gaZFcmiEvdazbD9Z8+hIlr+frC7Ne4N4LI0zvuPaT5uPrhn2RMxhiwaLVw70rctes+rPUTvwhPNg=="
+ },
"watchpack": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",
diff --git a/package.json b/package.json
index aa5ddab..9befba0 100644
--- a/package.json
+++ b/package.json
@@ -29,6 +29,7 @@
"react-dom": "^16.7.0",
"react-google-login": "^5.0.4",
"react-router-dom": "^4.3.1",
+ "react-toasts": "^3.0.3",
"redux-persist": "^5.10.0"
},
"devDependencies": {
diff --git a/src/components/MainCommand.js b/src/components/MainCommand.js
index cc2e209..24ab28b 100644
--- a/src/components/MainCommand.js
+++ b/src/components/MainCommand.js
@@ -5,9 +5,20 @@ const envVars = require('config');
import { GoogleLogin } from 'react-google-login';
-import { Button } from '@material-ui/core';
+import { Button, Card, Typography } from '@material-ui/core';
import { Send } from '@material-ui/icons';
+import { ToastsContainer, ToastsStore } from 'react-toasts';
+
+// Old notification elem for manual use
+// const notification = (
+//
+//
+// Successfully executed command!
+//
+//
+// );
+
const INITIAL_COMMAND_STATE = {
command: 'google',
commandInput: '',
@@ -65,6 +76,10 @@ class MainCommand extends Component {
});
}
+ componentDidMount() {
+ this.mainBar.focus();
+ }
+
googleSignIn = async e => {
await console.log('Going through sign in flow');
const signInResponse = await gapi.auth2.getAuthInstance().signIn();
@@ -107,25 +122,34 @@ class MainCommand extends Component {
newInput = newInput.replace('gmail', '');
newCommandInputPlaceholder = 'to | subject | message';
newNeedGoogleAuth = true;
- }
-
- if (newCommand == 'google') {
- newCommand = 'google';
- newCommandComplete = true;
- newCommandInputPlaceholder = 'search for anything';
- }
-
- if (newInput.includes('utube')) {
+ } else if (
+ newInput.includes('utube') &&
+ newCommandIcon == envVars.DEFAULT_LOGO
+ ) {
newCommand = 'utube';
newCommandIcon =
'https://cdn2.iconfinder.com/data/icons/micon-social-pack/512/youtube-512.png';
newInput = newInput.replace('utube', '');
newCommandComplete = true;
newCommandInputPlaceholder = 'search for any video';
+ } else if (
+ newInput.includes('red') &&
+ newCommandIcon == envVars.DEFAULT_LOGO
+ ) {
+ newCommand = 'reddit';
+ newCommandIcon =
+ 'https://cdn2.iconfinder.com/data/icons/micon-social-pack/512/youtube-512.png';
+ newInput = newInput.replace('utube', '');
+ newCommandComplete = true;
+ newCommandInputPlaceholder = 'search for any video';
+ } else if (newCommand == 'google') {
+ newCommand = 'google';
+ newCommandComplete = true;
+ newCommandInputPlaceholder = 'search for anything';
}
- // TODO: helper function to check if input complete and show submit button
if (newCommand == 'gmail') {
+ // TODO: helper function to check if input complete for current command and show submit button
const gmailSendParts = newInput.split('|');
if (gmailSendParts.length == 3) {
newCommandComplete = true;
@@ -191,7 +215,10 @@ class MainCommand extends Component {
);
}
- this.setState(INITIAL_COMMAND_STATE, () => console.log(this.state));
+ this.setState(INITIAL_COMMAND_STATE, () => {
+ console.log(this.state);
+ ToastsStore.success('Successfully executed command!');
+ });
};
render() {
@@ -222,6 +249,9 @@ class MainCommand extends Component {
{
+ this.mainBar = input;
+ }}
value={commandInput}
onChange={this.handleInputChange}
onKeyDown={this.handleInputKeyDown}
@@ -242,6 +272,8 @@ class MainCommand extends Component {
)}
+
+
);
}
diff --git a/src/components/root.less b/src/components/root.less
index 312a252..b660eca 100644
--- a/src/components/root.less
+++ b/src/components/root.less
@@ -112,12 +112,22 @@
top: 0;
width: 100%;
height: 100%;
- opacity: 0.5;
+ opacity: 0.3;
z-index: -1;
}
}
+.notificationCont {
+ background-color: #4bb543 !important;
+ color: white;
+ padding: 1em;
+ position: fixed;
+ top: 0;
+ right: 0;
+ margin: 1em;
+}
+
.hidden {
display: none !important;
}