fix: temporarily disable not working menu items (#449)

wexond · Apr 26, 2020 · b78c8a1 · b78c8a1
1 parent fe8f54d
commit b78c8a1
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 7 deletions.
diff --git a/src/renderer/views/menu/components/QuickMenu/index.tsx b/src/renderer/views/menu/components/QuickMenu/index.tsx
@@ -17,7 +17,6 @@ import { WEBUI_BASE_URL, WEBUI_URL_SUFFIX } from '~/constants/files';
 import { Switch } from '~/renderer/components/Switch';
 import {
   ICON_FIRE,
-  ICON_NIGHT,
   ICON_TOPMOST,
   ICON_TAB,
   ICON_WINDOW,
@@ -64,14 +63,22 @@ const onIncognitoClick = () => {
   ipcRenderer.send('create-window', true);
 };
 
-const goToWebUIPage = (name: string) => () => {
+const addNewTab = (url: string) => {
   ipcRenderer.send(`add-tab-${store.windowId}`, {
-    url: `${WEBUI_BASE_URL}${name}${WEBUI_URL_SUFFIX}`,
+    url,
     active: true,
   });
   store.hide();
 };
 
+const goToWebUIPage = (name: string) => () => {
+  addNewTab(`${WEBUI_BASE_URL}${name}${WEBUI_URL_SUFFIX}`);
+};
+
+const goToURL = (url: string) => () => {
+  addNewTab(url);
+};
+
 const onUpdateClick = () => {
   ipcRenderer.send('install-update');
 };
@@ -127,7 +134,7 @@ export const QuickMenu = observer(() => {
             <Icon icon={ICON_BOOKMARKS} />
             <MenuItemTitle>Bookmarks</MenuItemTitle>
           </MenuItem>
-          <MenuItem onClick={goToWebUIPage('downloads')}>
+          <MenuItem disabled onClick={goToWebUIPage('downloads')}>
             <Icon icon={ICON_DOWNLOAD} />
             <MenuItemTitle>Downloads</MenuItemTitle>
           </MenuItem>
@@ -136,12 +143,17 @@ export const QuickMenu = observer(() => {
             <Icon icon={ICON_SETTINGS} />
             <MenuItemTitle>Settings</MenuItemTitle>
           </MenuItem>
-          <MenuItem onClick={goToWebUIPage('extensions')}>
+          {/* TODO: <MenuItem onClick={goToWebUIPage('extensions')}> */}
+          <MenuItem
+            onClick={goToURL(
+              'https://chrome.google.com/webstore/category/extensions',
+            )}
+          >
             <Icon icon={ICON_EXTENSIONS} />
             <MenuItemTitle>Extensions</MenuItemTitle>
           </MenuItem>
           <Line />
-          <MenuItem>
+          <MenuItem disabled>
             <Icon icon={ICON_FIND} />
             <MenuItemTitle>Find in page</MenuItemTitle>
             <Shortcut>Ctrl+F</Shortcut>

diff --git a/src/renderer/views/menu/components/QuickMenu/style.ts b/src/renderer/views/menu/components/QuickMenu/style.ts
@@ -22,7 +22,7 @@ export const MenuItem = styled.div`
   padding: 0 12px;
   font-size: 12px;
 
-  ${({ arrow }: { arrow?: boolean }) =>
+  ${({ arrow }: { arrow?: boolean; disabled?: boolean }) =>
     arrow &&
     css`
       &:after {
@@ -40,6 +40,12 @@ export const MenuItem = styled.div`
       }
     `};
 
+  ${({ disabled }: { arrow?: boolean; disabled?: boolean }) =>
+    css`
+      pointer-events: ${disabled ? 'none' : 'inherit'};
+      opacity: ${disabled ? 0.54 : 1};
+    `};
+
   &:hover {
     ${({ theme }: { theme?: ITheme }) => css`
       background-color: ${theme['dialog.lightForeground']