style: format codebase with Prettier

src/i18n/i18n-react.tsx

@@ -14,7 +14,8 @@ const { component: TypesafeI18n, context: I18nContext } = initI18nReact<
   Formatters
 >(loadedLocales, loadedFormatters)
 
-const useI18nContext = (): I18nContextType<Locales, Translations, TranslationFunctions> => useContext(I18nContext)
+const useI18nContext = (): I18nContextType<Locales, Translations, TranslationFunctions> =>
+  useContext(I18nContext)
 
 export { I18nContext, useI18nContext }
 

src/i18n/i18n-util.async.ts

@@ -24,4 +24,5 @@ export const loadLocaleAsync = async (locale: Locales): Promise<void> => {
 
 export const loadAllLocalesAsync = (): Promise<void[]> => Promise.all(locales.map(loadLocaleAsync))
 
-export const loadFormatters = (locale: Locales): void => void (loadedFormatters[locale] = initFormatters(locale))
+export const loadFormatters = (locale: Locales): void =>
+  void (loadedFormatters[locale] = initFormatters(locale))

src/i18n/i18n-util.sync.ts

@@ -24,4 +24,5 @@ export const loadLocale = (locale: Locales): void => {
 
 export const loadAllLocales = (): void => locales.forEach(loadLocale)
 
-export const loadFormatters = (locale: Locales): void => void (loadedFormatters[locale] = initFormatters(locale))
+export const loadFormatters = (locale: Locales): void =>
+  void (loadedFormatters[locale] = initFormatters(locale))

src/main/index.ts

@@ -19,7 +19,9 @@ if (isDev)
 
 process.env.DIST_ELECTRON = join(__dirname, '../')
 process.env.DIST = join(process.env.DIST_ELECTRON, '../dist')
-process.env.PUBLIC = process.env.VITE_DEV_SERVER_URL ? join(process.env.DIST_ELECTRON, '../public') : process.env.DIST
+process.env.PUBLIC = process.env.VITE_DEV_SERVER_URL
+  ? join(process.env.DIST_ELECTRON, '../public')
+  : process.env.DIST
 
 if (release().startsWith('6.1')) app.disableHardwareAcceleration()
 

src/main/platforms/windows/__test__/windows.platform.spec.ts

@@ -24,7 +24,9 @@ describe('WinPlatform()', function () {
       netmask: '',
       mac_address: ''
     }
-    jest.spyOn(WindowsPlatform.prototype as any, 'getValidateInterface').mockImplementation(() => activeInterface)
+    jest
+      .spyOn(WindowsPlatform.prototype as any, 'getValidateInterface')
+      .mockImplementation(() => activeInterface)
 
     jest.spyOn(WindowsPlatform.prototype as any, 'execCmd').mockImplementation(() => '')
 
@@ -36,7 +38,9 @@ describe('WinPlatform()', function () {
       const validatedInterface = {
         name: 'xx'
       } as any
-      jest.spyOn(WindowsPlatform.prototype as any, 'getValidateInterface').mockImplementation(() => validatedInterface)
+      jest
+        .spyOn(WindowsPlatform.prototype as any, 'getValidateInterface')
+        .mockImplementation(() => validatedInterface)
 
       jest.spyOn(WindowsPlatform.prototype as any, 'execCmd').mockImplementation()
 
@@ -50,7 +54,9 @@ describe('WinPlatform()', function () {
       const validatedInterface = {
         name: 'xx'
       } as any
-      jest.spyOn(WindowsPlatform.prototype as any, 'getValidateInterface').mockImplementation(() => validatedInterface)
+      jest
+        .spyOn(WindowsPlatform.prototype as any, 'getValidateInterface')
+        .mockImplementation(() => validatedInterface)
 
       jest.spyOn(WindowsPlatform.prototype as any, 'execCmd').mockImplementation()
 

src/main/platforms/windows/windows.platform.ts

@@ -74,7 +74,9 @@ export class WindowsPlatform extends Platform {
   private async getValidateInterface() {
     try {
       const interfaces: Interface[] = await this.getInterfacesList()
-      const activeInterface: Interface | null = interfaces.find((inter: Interface) => inter.gateway_ip != null)
+      const activeInterface: Interface | null = interfaces.find(
+        (inter: Interface) => inter.gateway_ip != null
+      )
 
       if (!activeInterface) throw new Error('CONNECTION_FAILED')
       return activeInterface

src/main/shared/isDev.ts

@@ -1,10 +1,9 @@
-import electron from 'electron';
+import electron from 'electron'
 
+const { env } = process
+const isEnvSet = 'ELECTRON_IS_DEV' in env
+const getFromEnv = Number.parseInt(env.ELECTRON_IS_DEV, 10) === 1
 
-const { env } = process; 
-const isEnvSet = 'ELECTRON_IS_DEV' in env;
-const getFromEnv = Number.parseInt(env.ELECTRON_IS_DEV, 10) === 1;
+const isDev = isEnvSet ? getFromEnv : !electron.app.isPackaged
 
-const isDev = isEnvSet ? getFromEnv : !electron.app.isPackaged;
-
-export default isDev;
+export default isDev

src/renderer/component/buttons/add-custom-btn-component.tsx

@@ -14,7 +14,7 @@ export function AddCustomBtnComponent() {
 
   return (
     <div>
-      <Tooltip message='Add Custom DNS' position='top'>
+      <Tooltip message="Add Custom DNS" position="top">
         <Button
           shape={'circle'}
           size={'sm'}

src/renderer/component/buttons/edit-btn.component.tsx

@@ -6,7 +6,9 @@ export function EditButtonComponent() {
     <Button
       shape={'square'}
       size={'sm'}
-      className={'bg-[#d8d8d8] hover:bg-[#c4c4c4] dark:bg-[#383838] hover:dark:bg-[#323232] border-none text-center'}>
+      className={
+        'bg-[#d8d8d8] hover:bg-[#c4c4c4] dark:bg-[#383838] hover:dark:bg-[#323232] border-none text-center'
+      }>
       <AiOutlineEdit className={'dark:text-gray-600 text-gray-800'} size={16} />
     </Button>
   )

src/renderer/component/buttons/interfaces-dialog-btn-component.tsx

@@ -14,7 +14,7 @@ export function InterfacesDialogButtonComponent() {
 
   return (
     <div>
-      <Tooltip message='Network Interfaces' position='top'>
+      <Tooltip message="Network Interfaces" position="top">
         <Button
           shape={'circle'}
           size={'sm'}

src/renderer/component/buttons/togglePin-btn.component.tsx

@@ -1,11 +1,8 @@
-import { Button, Dialog, DialogBody, DialogFooter, DialogHeader, Typography, Badge } from '@material-tailwind/react'
-import React, { useContext, useEffect, useState } from 'react'
+import { useContext, useEffect, useState } from 'react'
 import { Button as ButtonDaisyui } from 'react-daisyui'
-import { AiOutlineDelete } from 'react-icons/ai'
-import { TbInfoHexagon } from 'react-icons/tb'
+
 import { serversContext } from '../../context/servers.context'
 import { ServersContext } from '../../interfaces/servers-context.interface'
-import { appNotif } from '../../notifications/appNotif'
 import { BsPin, BsPinFill } from 'react-icons/bs'
 
 export function ToggleButtonComponent() {
@@ -34,7 +31,9 @@ export function ToggleButtonComponent() {
       <ButtonDaisyui
         shape={'circle'}
         size={'sm'}
-        className={'dark:bg-[#262626] bg-base-200 hover:bg-[#c4c4c4] hover:dark:bg-[#323232] border-none text-center'}
+        className={
+          'dark:bg-[#262626] bg-base-200 hover:bg-[#c4c4c4] hover:dark:bg-[#323232] border-none text-center'
+        }
         onClick={handleClick}>
         {isPin ? (
           <BsPinFill className={'dark:text-gray-600 text-gray-800'} size={16} />

src/renderer/component/buttons/update-btn.component.tsx

@@ -1,6 +1,13 @@
 import { Button } from 'react-daisyui'
 import React, { useCallback, useEffect, useState } from 'react'
-import { Dialog, DialogBody, DialogFooter, DialogHeader, Typography, Progress } from '@material-tailwind/react'
+import {
+  Dialog,
+  DialogBody,
+  DialogFooter,
+  DialogHeader,
+  Typography,
+  Progress
+} from '@material-tailwind/react'
 import { CgSoftwareDownload } from 'react-icons/cg'
 import { ProgressInfo } from 'electron-builder'
 import { UpdateInfo } from 'electron-updater'
@@ -52,7 +59,6 @@ function DetailsModal(prop: Props): JSX.Element {
   useEffect(() => {
     if (prop.updateInfo) {
       setOpenDialog(true)
-
       ;(async () => {
         await window.ipc.startUpdate()
       })()
@@ -91,7 +97,9 @@ function DetailsModal(prop: Props): JSX.Element {
   return (
     <Dialog open={openDialog} size={'xl'} handler={() => {}} className="bg-[#282828] rounded-2xl">
       <DialogHeader className={'justify-center dark:text-white flex flex-row gap-2 py-5'}>
-        <h3 className={'font-[BalooTamma] text-[#DADADA] text-[23px]'}>🎉 Found version {prop.updateInfo.version}</h3>
+        <h3 className={'font-[BalooTamma] text-[#DADADA] text-[23px]'}>
+          🎉 Found version {prop.updateInfo.version}
+        </h3>
       </DialogHeader>
       <DialogBody className={'p-8'}>
         <div className="w-full">

src/renderer/component/head/navbar.component.tsx

@@ -59,7 +59,10 @@ export function NavbarComponent() {
 
             {!isOnline && (
               <Button color="ghost" size="sm" className="text-[#c54444]">
-                <Tooltip message={'check your network connection status'} position={'bottom'} className="normal-case">
+                <Tooltip
+                  message={'check your network connection status'}
+                  position={'bottom'}
+                  className="normal-case">
                   <FiWifiOff />
                 </Tooltip>
               </Button>

src/renderer/component/modals/add-dns.component.tsx

@@ -62,7 +62,8 @@ export function AddDnsModalComponent(props: Props) {
         })
       }
       if (resp.success) {
-        if (resp.server.name === 'default') appNotif('Success', 'Default DNS server has been set/updated', 'SUCCESS')
+        if (resp.server.name === 'default')
+          appNotif('Success', 'Default DNS server has been set/updated', 'SUCCESS')
         else appNotif('Success', LL.dialogs.added_server({ serverName: serverName }), 'SUCCESS')
         setNameServer1('')
         setNameServer2('')
@@ -84,11 +85,19 @@ export function AddDnsModalComponent(props: Props) {
 
         <CardBody className="flex flex-col gap-4">
           <Tabs value={type}>
-            <TabsHeader className="bg-gray-300 dark:bg-[#262626]" indicatorProps={{ className: 'bg-[#7487FF]' }}>
-              <Tab value="ipv4" className="dark:text-gray-200 font-[balooTamma]" onClick={() => setType('ipv4')}>
+            <TabsHeader
+              className="bg-gray-300 dark:bg-[#262626]"
+              indicatorProps={{ className: 'bg-[#7487FF]' }}>
+              <Tab
+                value="ipv4"
+                className="dark:text-gray-200 font-[balooTamma]"
+                onClick={() => setType('ipv4')}>
                 IPV4
               </Tab>
-              <Tab value="default" className="dark:text-gray-200 font-[balooTamma]" onClick={() => setType('default')}>
+              <Tab
+                value="default"
+                className="dark:text-gray-200 font-[balooTamma]"
+                onClick={() => setType('default')}>
                 Default
               </Tab>
             </TabsHeader>
@@ -152,8 +161,8 @@ export function AddDnsModalComponent(props: Props) {
                 <div className={'grid'}>
                   <div>
                     <p className="text-[13px] dark:text-gray-400 font-[Inter] bg-[#f2f2f2] dark:bg-[#262626] p-2 rounded-md">
-                      Set the default DNS server for your system. This will be used when no custom server is set.
-                      (Optional)
+                      Set the default DNS server for your system. This will be used when no custom server is
+                      set. (Optional)
                     </p>
                   </div>
                   <div className={''}>
@@ -194,7 +203,11 @@ export function AddDnsModalComponent(props: Props) {
         </CardBody>
 
         <CardFooter className="pt-0 flex flex-row gap-2">
-          <Button variant="text" className="normal-case font-[balooTamma] text-xl" color="red" onClick={handleOpen}>
+          <Button
+            variant="text"
+            className="normal-case font-[balooTamma] text-xl"
+            color="red"
+            onClick={handleOpen}>
             Close
           </Button>
           <Button

src/renderer/component/selectes/servers/index.tsx

@@ -30,7 +30,10 @@ function servers(serversStateContext: ServersContext): any {
   const renderServer = (server: ServerStore) => {
     const isConnect = serversStateContext.currentActive?.key === server.key
     return (
-      <Select.Option key={server.key} value={server.key} selected={server.key === serversStateContext.selected?.key}>
+      <Select.Option
+        key={server.key}
+        value={server.key}
+        selected={server.key === serversStateContext.selected?.key}>
         {isConnect ? '🟢' : '🔴'} {server.name}
       </Select.Option>
     )

src/renderer/component/servers/server.component.tsx

@@ -22,11 +22,9 @@ export function ServerComponent(prop: Props) {
   const isConnect = server.key == prop.currentActive?.key
   const activityContextData = React.useContext<ActivityContext>(activityContext)
   const setCurrentActive: setState<Server | null> = prop.setCurrentActive
-  const currentActive: Server = prop.currentActive
   const [connecting, setConnecting] = useState<boolean>(false)
   const [currentPing, setPing] = useState<number>(0)
 
-  // @ts-ignore
   const serverName = server.names[locale] || server.names.eng
 
   async function clickHandler() {
@@ -75,21 +73,18 @@ export function ServerComponent(prop: Props) {
   return (
     <div>
       <div
-        className={`py-6 border-l-2 border-r-2 rounded-lg shadow-md mb-2 mt-1  ${
-          isConnect ? 'dark:shadow-green-500/20 shadow-teal-300/20' : 'drop-shadow-lg'
-        }
-             border-gray-400 dark:border-gray-600
-                ${
-                  isConnect
-                    ? 'bg-green-500 text-white  hover:bg-red-500 hover:shadow-none'
-                    : 'hover:bg-green-500 text-accent-content'
-                }
+        className={`py-6 border-l-2 border-r-2 rounded-lg shadow-md mb-2 mt-1  
+        ${isConnect ? 'dark:shadow-green-500/20 shadow-teal-300/20' : 'drop-shadow-lg'} 
+        border-gray-400 dark:border-gray-600  
+        ${isConnect ? 'bg-green-500 text-white  hover:bg-red-500 hover:shadow-none' : 'hover:bg-green-500 text-accent-content'}
                 ${activityContextData.isWaiting && isConnect ? 'bg-red-400 animate-pulse shadow-none' : ''}
                 ${activityContextData.isWaiting && connecting ? 'bg-green-400 animate-pulse' : ''}
                 overflow-y-hidden
             `}>
         <div className="flex flex-nowrap ">
-          <div className="flex-none ml-2 relative" onClick={() => !activityContextData.isWaiting && clickHandler()}>
+          <div
+            className="flex-none ml-2 relative"
+            onClick={() => !activityContextData.isWaiting && clickHandler()}>
             {typeof activityContextData.reqPing == 'boolean' && Number(currentPing) ? (
               <div
                 className={`absolute top-1/2 text-left -translate-y-1/2 -right-10 border-1 w-20 h-10 rounded-3xl bg-opacity-80 ${getColor(
@@ -110,7 +105,9 @@ export function ServerComponent(prop: Props) {
               </div>
             )}
           </div>
-          <div className="flex-1 w-20 cursor-pointer" onClick={() => !activityContextData.isWaiting && clickHandler()}>
+          <div
+            className="flex-1 w-20 cursor-pointer"
+            onClick={() => !activityContextData.isWaiting && clickHandler()}>
             <Tooltip message={isConnect ? LL.help_disconnect() : LL.help_connect()} position={'bottom'}>
               <p className={'font-medium'}>{serverName}</p>
             </Tooltip>

src/renderer/interfaces/servers-context.interface.ts

@@ -1,4 +1,4 @@
-import { Server, ServerStore } from '../../shared/interfaces/server.interface'
+import { ServerStore } from '../../shared/interfaces/server.interface'
 
 export interface ServersContext {
   servers: ServerStore[]

src/renderer/pages/explore.page.tsx

@@ -78,7 +78,7 @@ export function ExplorePage() {
       return
     }
     const filtered = STORED_SERVERS.filter(server => {
-      let regex = new RegExp(value, 'i')
+      const regex = new RegExp(value, 'i')
       if (server.name.toLowerCase().match(regex)) {
         return server
       }
@@ -114,7 +114,12 @@ export function ExplorePage() {
             </div>
             <div className="flex flex-row justify-center items-center  px-2 gap-1">
               {loading && <span className="loading loading-ring loading-xs mr-3"></span>}
-              <Button size={'sm'} shape="circle" color={'ghost'} disabled={loading} onClick={() => fetchDnsList()}>
+              <Button
+                size={'sm'}
+                shape="circle"
+                color={'ghost'}
+                disabled={loading}
+                onClick={() => fetchDnsList()}>
                 <IoReload size={20} className={'dark:text-gray-400 text-gray-800'} />
               </Button>
             </div>
@@ -254,7 +259,9 @@ function ServerTrComponent(prop: Prop) {
               className="w-72 dark:bg-[#272727] dark:border-gray-700 dark:shadow-md shadow-lg border-none">
               <List className="p-0 dark:text-gray-400">
                 <a href="#" className="text-initial w-60">
-                  <ListItem className={'text-xs'} onClick={event => navigator.clipboard.writeText(servers.join(','))}>
+                  <ListItem
+                    className={'text-xs'}
+                    onClick={() => navigator.clipboard.writeText(servers.join(','))}>
                     <ListItemPrefix>
                       <FiCopy />
                     </ListItemPrefix>
@@ -264,7 +271,7 @@ function ServerTrComponent(prop: Prop) {
                 <a href="#" className="text-initial w-60">
                   <ListItem
                     className={'text-xs cursor-default'}
-                    onClick={event => navigator.clipboard.writeText(servers.join(','))}>
+                    onClick={() => navigator.clipboard.writeText(servers.join(','))}>
                     <ListItemPrefix>Rate</ListItemPrefix>
                     <Rating className={'cursor-default'} value={ratingValue} readonly={true} />
                   </ListItem>

src/shared/constants/urls.constant.ts

@@ -1,4 +1,4 @@
 export enum UrlsConstant {
   STORE = 'https://raw.githubusercontent.com/DnsChanger/dnsChanger-desktop/store/servers_DB.json',
-  STORE_SERVER = "https://dnschanger-store.liara.run/"
+  STORE_SERVER = 'https://dnschanger-store.liara.run/'
 }