Feature/nym connect logs in app (#3045)

* remove menu bar

* create log view toggle function

* update routes

* update changelog

* fix clippy error

nym-connect/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## UNRELEASED
 
+## [nym-connect-v1.1.10](https://github.com/nymtech/nym/tree/nym-connect-v1.1.10) (2023-02-21)
+
+- Allow opening and closing of logs within the app
+
 ## [nym-connect-v1.1.9](https://github.com/nymtech/nym/tree/nym-connect-v1.1.9) (2023-02-14)
 
 - Button animations ([#2949])

nym-connect/src-tauri/src/main.rs

@@ -6,10 +6,9 @@
 use std::sync::Arc;
 
 use config_common::defaults::setup_env;
-use tauri::{Manager, Menu};
+use tauri::Manager;
 use tokio::sync::RwLock;
 
-use crate::menu::AddDefaultSubmenus;
 use crate::menu::{create_tray_menu, tray_menu_event_handler};
 use crate::state::State;
 use crate::window::window_toggle;
@@ -64,7 +63,6 @@ fn main() {
             crate::operations::growth::test_and_earn::growth_tne_toggle_window,
             crate::operations::help::log::help_log_toggle_window,
         ])
-        .menu(Menu::os_default(&context.package_info().name).add_default_app_submenus())
         .on_menu_event(|event| {
             if event.menu_item_id() == menu::SHOW_LOG_WINDOW {
                 let _r = crate::operations::help::log::help_log_toggle_window(

nym-connect/src/pages/menu/settings/GatewaySettings.tsx

@@ -5,7 +5,7 @@ import { useClientContext } from 'src/context/main';
 import { ConnectionStatusKind } from 'src/types';
 import { AppVersion } from 'src/components/AppVersion';
 
-export const Settings = () => {
+export const GatewaySettings = () => {
   const { userDefinedGateway, setUserDefinedGateway } = useClientContext();
   const [gatewayKey, setGatewayKey] = useState<string | undefined>(userDefinedGateway?.gateway);
 

nym-connect/src/pages/menu/settings/index.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import { Link as RouterLink } from 'react-router-dom';
+import { Link, List, ListItem, ListItemButton, ListItemText, Stack } from '@mui/material';
+import { AppVersion } from 'src/components/AppVersion';
+import { toggle_log_viewer } from 'src/utils';
+
+const menuSchema = [{ title: 'Select your gateway', path: 'gateway' }];
+
+export const SettingsMenu = () => (
+  <Stack justifyContent="space-between" height="100%">
+    <List dense disablePadding>
+      {menuSchema.map((item) => (
+        <Link component={RouterLink} to={item.path} underline="none" color="white" key={item.title}>
+          <ListItem disablePadding>
+            <ListItemButton>
+              <ListItemText>{item.title}</ListItemText>
+            </ListItemButton>
+          </ListItem>
+        </Link>
+      ))}
+      <ListItem disablePadding>
+        <ListItemButton onClick={toggle_log_viewer}>
+          <ListItemText>Logs</ListItemText>
+        </ListItemButton>
+      </ListItem>
+    </List>
+    <AppVersion />
+  </Stack>
+);

nym-connect/src/routes/index.tsx

@@ -1,10 +1,11 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Routes, Route } from 'react-router-dom';
 import { ConnectionPage } from 'src/pages/connection';
 import { Menu } from 'src/pages/menu';
 import { CompatibleApps } from 'src/pages/menu/Apps';
 import { HelpGuide } from 'src/pages/menu/Guide';
-import { Settings } from 'src/pages/menu/Settings';
+import { SettingsMenu } from 'src/pages/menu/settings';
+import { GatewaySettings } from 'src/pages/menu/settings/GatewaySettings';
 
 export const AppRoutes = () => (
   <Routes>
@@ -13,7 +14,10 @@ export const AppRoutes = () => (
       <Route index element={<Menu />} />
       <Route path="apps" element={<CompatibleApps />} />
       <Route path="guide" element={<HelpGuide />} />
-      <Route path="settings" element={<Settings />} />
+      <Route path="settings">
+        <Route index element={<SettingsMenu />} />
+        <Route path="gateway" element={<GatewaySettings />} />
+      </Route>
     </Route>
   </Routes>
 );

nym-connect/src/utils/index.ts

@@ -1,5 +1,6 @@
 import { useEffect, useRef } from 'react';
 import { EventName, listen, UnlistenFn, EventCallback } from '@tauri-apps/api/event';
+import { invoke } from '@tauri-apps/api';
 
 export const useTauriEvents = <T>(event: EventName, handler: EventCallback<T>) => {
   const unlisten = useRef<UnlistenFn>();
@@ -17,3 +18,7 @@ export const useTauriEvents = <T>(event: EventName, handler: EventCallback<T>) =
     };
   }, []);
 };
+
+export const toggle_log_viewer = async () => {
+  await invoke('help_log_toggle_window');
+};