v0.0.60

electron-builder.yml

@@ -21,8 +21,7 @@ files:
 asarUnpack:
   - public/**
 win:
-  # Vedere come fare dopo aver ottenuto le icone nel giusto formato
-  icon: icons/nethlink-icon-desktop.ico
+  icon: icons/icon.ico
   target:
     - nsis
     #- zip
@@ -39,8 +38,8 @@ nsis:
   shortcutName: ${productName}
   uninstallDisplayName: ${productName}-${version}
 mac:
-  # Vedere come fare dopo aver ottenuto le icone nel giusto formato
-  icon: icons/nethlink-icon-desktop.icns
+  #icon: icons/icon.icns
+  icon: icons/icon512x512.png
   #identity: 11AF607C955FB944DB9DDF31AE651B4CB39EBCA9
   category: public.app-category.productivity
   gatekeeperAssess: false
@@ -60,8 +59,7 @@ mac:
     - dmg
     #- mas
 linux:
-  # Vedere come fare dopo aver ottenuto le icone nel giusto formato
-  icon: icons/512x512.png
+  icon: icons/icon512x512.png
   target:
     #- snap
     - AppImage

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nethlink",
-  "version": "0.0.59",
+  "version": "0.0.60",
   "description": "Neth Connector app",
   "main": "./out/main/main.js",
   "license": "UNLICENSED",

src/main/classes/controllers/TrayController.ts

@@ -14,7 +14,7 @@ export class TrayController {
   constructor() {
     TrayController.instance = this
 
-    this.tray = new Tray(join(__dirname, '../../public/TrayToolbarIcon.png'))
+    this.tray = new Tray(join(__dirname, '../../public/TrayToolbarIcon20x20.png'))
     this.tray.setIgnoreDoubleClickEvents(true)
     this.tray.on('click', () => {
       if (this.enableClick) {

src/renderer/src/components/AddToPhonebookBox.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useRef } from 'react'
 import { Button, TextInput } from './Nethesis'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faSpinner as LoadingIcon } from '@fortawesome/free-solid-svg-icons'
@@ -7,6 +7,7 @@ import { useForm, SubmitHandler } from 'react-hook-form'
 import { t } from 'i18next'
 import * as z from 'zod'
 import { zodResolver } from '@hookform/resolvers/zod'
+import { validatePhoneNumber } from '@renderer/utils'
 
 export interface AddToPhonebookBoxProps {
   searchText?: string
@@ -23,11 +24,12 @@ export function AddToPhonebookBox({
   onCancel,
   handleAddContactToPhonebook
 }: AddToPhonebookBoxProps) {
+  const submitButtonRef = useRef<HTMLButtonElement>(null)
   const baseSchema = z.object({
     privacy: z.string(),
-    extension: z.string(),
-    workphone: z.string(),
-    cellphone: z.string(),
+    extension: z.string().trim().regex(/^[0-9*#+]*$/, 'This is not a phone number'),
+    workphone: z.string().trim().regex(/^[0-9*#+]*$/, 'This is not a phone number'),
+    cellphone: z.string().trim().regex(/^[0-9*#+]*$/, 'This is not a phone number'),
     workemail: z.string(),
     notes: z.string()
   })
@@ -89,17 +91,13 @@ export function AddToPhonebookBox({
     handleSave(data)
   }
 
-  function containsOnlyNumber(text: string) {
-    return /^\d+$/.test(text)
-  }
-
   useEffect(() => {
     reset()
     setValue('privacy', 'public')
     setValue('type', 'person')
 
     if (searchText !== undefined) {
-      if (containsOnlyNumber(searchText)) {
+      if (validatePhoneNumber(searchText)) {
         setValue('extension', searchText)
       } else {
         setValue('name', searchText)
@@ -117,19 +115,22 @@ export function AddToPhonebookBox({
   function handleSave(data: ContactType) {
     //NETHVOICE usa il valore '-' quando si inserisce una company che e' priva di nome
     //data.name === '' puo' essere vera solo nel caso in cui si inserisce una company
-    if (watchType === 'company') {
-      data.name = '-'
-    }
-    setIsLoading(true)
-    handleAddContactToPhonebook(data)
-      .catch((error) => {
-        //TODO: gestione errore inserimento
-        console.error(error)
-      })
-      .finally(() => {
-        setIsLoading(false)
-        reset()
-      })
+    setIsLoading(true);
+    //Aggiunto un timeout per fare vedere lo spinner in quanto la chiamata e' troppo veloce
+    setTimeout(() => {
+      if (watchType === 'company') {
+        data.name = '-'
+      }
+      handleAddContactToPhonebook(data)
+        .catch((error) => {
+          //TODO: gestione errore inserimento
+          console.error(error)
+        })
+        .finally(() => {
+          setIsLoading(false)
+          reset()
+        })
+    }, 300);
   }
 
   return (
@@ -231,6 +232,7 @@ export function AddToPhonebookBox({
               onKeyDown={(e) => {
                 if (e.key === 'Enter') {
                   e.preventDefault()
+                  submitButtonRef.current?.focus()
                   handleSubmit(onSubmitForm)(e)
                 }
               }}
@@ -247,6 +249,7 @@ export function AddToPhonebookBox({
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               e.preventDefault()
+              submitButtonRef.current?.focus()
               handleSubmit(onSubmitForm)(e)
             }
           }}
@@ -257,13 +260,16 @@ export function AddToPhonebookBox({
           {...register('extension')}
           type="tel"
           minLength={3}
-          onChange={(e) => {
-            setValue('extension', e.target.value.replace(/\D/g, ''))
-          }}
+          // onChange={(e) => {
+          //   setValue('extension', e.target.value.replace(/[^\d*#+]/g, ''))
+          // }}
           label={t('Phonebook.Phone number') as string}
+          helper={errors.extension?.message || undefined}
+          error={!!errors.extension?.message}
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               e.preventDefault()
+              submitButtonRef.current?.focus()
               handleSubmit(onSubmitForm)(e)
             }
           }}
@@ -274,13 +280,16 @@ export function AddToPhonebookBox({
           {...register('workphone')}
           type="tel"
           minLength={3}
-          onChange={(e) => {
-            setValue('workphone', e.target.value.replace(/\D/g, ''))
-          }}
+          // onChange={(e) => {
+          //   setValue('workphone', e.target.value.replace(/[^\d*#+]/g, ''))
+          // }}
           label={t('Phonebook.Work phone') as string}
+          helper={errors.workphone?.message || undefined}
+          error={!!errors.workphone?.message}
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               e.preventDefault()
+              submitButtonRef.current?.focus()
               handleSubmit(onSubmitForm)(e)
             }
           }}
@@ -291,13 +300,16 @@ export function AddToPhonebookBox({
           {...register('cellphone')}
           type="tel"
           minLength={3}
-          onChange={(e) => {
-            setValue('cellphone', e.target.value.replace(/\D/g, ''))
-          }}
+          // onChange={(e) => {
+          //   setValue('cellphone', e.target.value.replace(/[^\d*#+]/g, ''))
+          // }}
           label={t('Phonebook.Mobile phone') as string}
+          helper={errors.cellphone?.message || undefined}
+          error={!!errors.cellphone?.message}
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               e.preventDefault()
+              submitButtonRef.current?.focus()
               handleSubmit(onSubmitForm)(e)
             }
           }}
@@ -311,6 +323,7 @@ export function AddToPhonebookBox({
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               e.preventDefault()
+              submitButtonRef.current?.focus()
               handleSubmit(onSubmitForm)(e)
             }
           }}
@@ -324,6 +337,7 @@ export function AddToPhonebookBox({
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               e.preventDefault()
+              submitButtonRef.current?.focus()
               handleSubmit(onSubmitForm)(e)
             }
           }}
@@ -334,6 +348,7 @@ export function AddToPhonebookBox({
           <Button
             variant="ghost"
             onClick={() => onCancel()}
+            disabled={isLoading}
             className="dark:focus:ring-2 dark:focus:ring-offset-2 dark:focus:ring-blue-200 dark:focus:ring-offset-gray-900 focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 focus:ring-offset-white"
           >
             <p className="dark:text-blue-500 text-blue-700 font-medium text-[14px] leading-5">
@@ -342,6 +357,7 @@ export function AddToPhonebookBox({
           </Button>
           <Button
             type="submit"
+            ref={submitButtonRef}
             className="gap-3 dark:bg-blue-500 bg-blue-700 dark:hover:bg-blue-300 hover:bg-blue-800 dark:focus:ring-2 dark:focus:ring-offset-2 dark:focus:ring-blue-200 dark:focus:ring-offset-gray-900 focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 focus:ring-offset-white"
           >
             <p className="dark:text-gray-950 text-gray-50 font-medium text-[14px] leading-5">

src/renderer/src/components/Navbar.tsx

@@ -1,6 +1,7 @@
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { SearchBox } from './SearchBox'
 import {
+  faXmarkCircle as ExitIcon,
   faSliders as ThemeMenuIcon,
   faArrowRightFromBracket as LogoutIcon,
   faPalette as SystemIcon,
@@ -20,11 +21,13 @@ import { faCircleUser as DefaultAvatar } from '@fortawesome/free-solid-svg-icons
 export interface NavabarProps {
   search: string
   account: Account
+  callUser: (phoneNumber: string) => void
   onSelectTheme: (theme: AvailableThemes) => void
   logout: () => void
   handleSearch: (searchText: string) => Promise<void>
   handleReset: () => void
   goToNethVoicePage: () => void
+  exitNethLink: () => void
 }
 
 const themeOptions = [
@@ -36,11 +39,13 @@ const themeOptions = [
 export function Navbar({
   search,
   account,
+  callUser,
   onSelectTheme,
   logout,
   handleSearch,
   handleReset,
-  goToNethVoicePage
+  goToNethVoicePage,
+  exitNethLink
 }: NavabarProps): JSX.Element {
   const operators = useSubscriber<OperatorData>('operators')
   const theme = useSubscriber<AvailableThemes>('theme')
@@ -51,7 +56,7 @@ export function Navbar({
 
   return (
     <div className="flex flex-row items-center justify-between gap-4 max-w-[318px] px-4 py-2">
-      <SearchBox search={search} handleSearch={handleSearch} handleReset={handleReset} />
+      <SearchBox search={search} callUser={callUser} handleSearch={handleSearch} handleReset={handleReset} />
       <div className="flex flex-row min-w-20 gap-4 items-center">
         <div>
           <Listbox>
@@ -163,13 +168,23 @@ export function Navbar({
               </Menu.Item>
               <Menu.Item
                 as={'div'}
-                className="cursor-pointer dark:text-gray-50 text-gray-900 dark:hover:bg-gray-600 hover:bg-gray-200 rounded-b-lg"
+                className="cursor-pointer dark:text-gray-50 text-gray-900 dark:hover:bg-gray-600 hover:bg-gray-20"
               >
                 <div className="flex flex-row items-center gap-4 py-[10px] px-6" onClick={logout}>
                   <FontAwesomeIcon className="text-base" icon={LogoutIcon} />
                   <p className="font-normal">{t('TopBar.Logout')}</p>
                 </div>
               </Menu.Item>
+              <Menu.Item
+                as={'div'}
+                className="cursor-pointer dark:text-gray-50 text-gray-900 dark:hover:bg-gray-600 hover:bg-gray-200 rounded-b-lg"
+              >
+                <div className="flex flex-row items-center gap-4 py-[10px] px-6" onClick={exitNethLink}>
+                  <FontAwesomeIcon className="text-base" icon={ExitIcon} />
+                  <p className="font-normal">{'Quit'}</p>
+                </div>
+              </Menu.Item>
+
             </Menu.Items>
           </Menu>
         </div>

src/renderer/src/components/SearchBox.tsx

@@ -6,14 +6,16 @@ import { TextInput } from './Nethesis/TextInput'
 import { t } from 'i18next'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { Button } from './Nethesis'
+import { validatePhoneNumber } from '@renderer/utils'
 
 export interface SearchBoxProps {
   search: string
+  callUser: (phoneNumber: string) => void
   handleSearch: (searchText: string) => Promise<void>
   handleReset: () => void
 }
 
-export function SearchBox({ search, handleSearch, handleReset }: SearchBoxProps): JSX.Element {
+export function SearchBox({ search, callUser, handleSearch, handleReset }: SearchBoxProps): JSX.Element {
   function reset(searchText: string): void {
     if (searchText === '') {
       handleReset()
@@ -39,7 +41,11 @@ export function SearchBox({ search, handleSearch, handleReset }: SearchBoxProps)
         onSubmit={() => submit(search)}
         onKeyDown={(e) => {
           if (e.key === 'Enter') {
-            submit(search)
+            if (validatePhoneNumber(search)) {
+              callUser(search)
+            } else {
+              submit(search)
+            }
           }
         }}
         className="min-w-[222px] dark:text-gray-50 text-gray-900 dark:focus:ring-2 dark:focus:ring-offset-2 dark:focus:ring-blue-200 dark:focus:ring-offset-gray-900 focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 focus:ring-offset-white"