8599716186

Committed 08 Apr 2024 12:05PM UTC coverage: 95.019% (-0.2%) from 95.205%

Build # 8599716186

Build Type

push

github

Committed by

web-flow

Commit Message

fix: manual biome linter errors (#978)

Run Details

357 of 375 branches covered (95.2%)

Branch coverage included in aggregate %.

19 of 20 new or added lines in 8 files covered. (95.0%)

12 existing lines in 4 files now uncovered.

864 of 910 relevant lines covered (94.95%)

16.53 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

92.86

/src/routes/Settings.tsx

import {
  ArrowLeftIcon,
  PersonAddIcon,
  SignOutIcon,
  XCircleIcon,
} from '@primer/octicons-react';
import { ipcRenderer } from 'electron';

import {
  type FC,
  useCallback,
  useContext,
  useEffect,
  useMemo,
  useState,
} from 'react';
import { useNavigate } from 'react-router-dom';

import { FieldCheckbox } from '../components/fields/Checkbox';
import { FieldRadioGroup } from '../components/fields/RadioGroup';
import { AppContext } from '../context/App';
import { Theme } from '../types';
import { apiRequestAuth } from '../utils/api-requests';
import {
  openExternalLink,
  updateTrayIcon,
  updateTrayTitle,
} from '../utils/comms';
import Constants from '../utils/constants';
import { generateGitHubAPIUrl } from '../utils/helpers';
import { setTheme } from '../utils/theme';

export const SettingsRoute: FC = () => {
  const { accounts, settings, updateSetting, logout } = useContext(AppContext);
  const navigate = useNavigate();

  const [isLinux, setIsLinux] = useState<boolean>(false);
  const [appVersion, setAppVersion] = useState<string | null>(null);
  const [colorScope, setColorScope] = useState<boolean>(false);

  const openGitHubReleaseNotes = useCallback((version) => {
    openExternalLink(
      `https://github.com/${Constants.REPO_SLUG}/releases/tag/v${version}`,
    );
  }, []);

  useEffect(() => {
    ipcRenderer.invoke('get-platform').then((result: string) => {
      setIsLinux(result === 'linux');
    });

    ipcRenderer.invoke('get-app-version').then((result: string) => {
      setAppVersion(result);
    });
  }, []);

  useMemo(() => {
    (async () => {
      const response = await apiRequestAuth(
        `${generateGitHubAPIUrl(Constants.DEFAULT_AUTH_OPTIONS.hostname)}`,
        'GET',
        accounts.token,
      );

      if (response.headers['x-oauth-scopes'].includes('repo'))
        setColorScope(true);
    })();
  }, [accounts.token]);

  ipcRenderer.on('update-native-theme', (_, updatedTheme: Theme) => {
    if (settings.theme === Theme.SYSTEM) {
      setTheme(updatedTheme);
    }
  });

  const logoutUser = useCallback(() => {
    logout();
    navigate(-1);
    updateTrayIcon();
    updateTrayTitle();
  }, []);

  const quitApp = useCallback(() => {
    ipcRenderer.send('app-quit');
  }, []);

  const goToEnterprise = useCallback(() => {
    return navigate('/login-enterprise', { replace: true });
  }, []);

  const footerButtonClass =
    'hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none';

  return (
    <div
      className="flex flex-1 flex-col h-screen dark:bg-gray-dark dark:text-white"
      data-testid="settings"
    >
      <div className="flex justify-between items-center mt-2 py-2 mx-8">
        <button
          type="button"
          className="focus:outline-none"
          title="Go Back"
          onClick={() => navigate(-1)}
        >
          <ArrowLeftIcon
            size={20}
            className="hover:text-gray-400"
            aria-label="Go Back"
          />
        </button>

        <h3 className="text-lg font-semibold">Settings</h3>
      </div>

      <div className="flex-grow overflow-x-auto px-8">
        <fieldset className="mb-3">
          <legend id="appearance" className="font-semibold mt-2 mb-1">
            Appearance
          </legend>
          <FieldRadioGroup
            name="theme"
            label="Theme:"
            value={settings.theme}
            options={[
              { label: 'System', value: Theme.SYSTEM },
              { label: 'Light', value: Theme.LIGHT },
              { label: 'Dark', value: Theme.DARK },
            ]}
            onChange={(evt) => {
              updateSetting('theme', evt.target.value);
            }}
          />
          <FieldCheckbox
            name="colors"
            label={`Use GitHub-like state colors${
              !colorScope ? ' (requires repo scope)' : ''
            }`}
            checked={colorScope && settings.colors}
            onChange={(evt) =>
              colorScope && updateSetting('colors', evt.target.checked)
            }
            disabled={!colorScope}
          />
          <FieldCheckbox
            name="showAccountHostname"
            label="Show account hostname"
            checked={settings.showAccountHostname}
            onChange={(evt) =>
              updateSetting('showAccountHostname', evt.target.checked)
            }
          />
        </fieldset>

        <fieldset className="mb-3">
          <legend id="notifications" className="font-semibold  mt-2 mb-1">
            Notifications
          </legend>
          <FieldCheckbox
            name="showOnlyParticipating"
            label="Show only participating"
            checked={settings.participating}
            onChange={(evt) =>
              updateSetting('participating', evt.target.checked)
            }
          />
          <FieldCheckbox
            name="showBots"
            label="Show notifications from Bot accounts"
            checked={settings.showBots}
            onChange={(evt) => updateSetting('showBots', evt.target.checked)}
          />
          <FieldCheckbox
            name="markAsDoneOnOpen"
            label="Mark as done on open"
            checked={settings.markAsDoneOnOpen}
            onChange={(evt) =>
              updateSetting('markAsDoneOnOpen', evt.target.checked)
            }
          />
        </fieldset>

        <fieldset className="mb-3">
          <legend id="system" className="font-semibold  mt-2 mb-1">
            System
          </legend>
          <FieldCheckbox
            name="showNotificationsCountInTray"
            label="Show notifications count in tray"
            checked={settings.showNotificationsCountInTray}
            onChange={(evt) =>
              updateSetting('showNotificationsCountInTray', evt.target.checked)
            }
          />
          <FieldCheckbox
            name="showNotifications"
            label="Show system notifications"
            checked={settings.showNotifications}
            onChange={(evt) =>
              updateSetting('showNotifications', evt.target.checked)
            }
          />
          <FieldCheckbox
            name="playSound"
            label="Play sound"
            checked={settings.playSound}
            onChange={(evt) => updateSetting('playSound', evt.target.checked)}
          />
          {!isLinux && (
            <FieldCheckbox
              name="openAtStartUp"
              label="Open at startup"
              checked={settings.openAtStartup}
              onChange={(evt) =>
                updateSetting('openAtStartup', evt.target.checked)
              }
            />
          )}
        </fieldset>
      </div>

      <div className="flex justify-between items-center bg-gray-200 dark:bg-gray-darker py-1 px-8">
        <button
          type="button"
          className="font-semibold cursor-pointer"
          title="View release notes"
          onClick={() => openGitHubReleaseNotes(appVersion)}
        >
          Gitify v{appVersion}
        </button>
        <div>
          <button
            type="button"
            className={footerButtonClass}
            title="Login with GitHub Enterprise"
            onClick={goToEnterprise}
          >
            <PersonAddIcon
              size={20}
              aria-label="Login with GitHub Enterprise"
            />
          </button>

          <button
            type="button"
            className={footerButtonClass}
            title={`Logout ${accounts.user.login}`}
            role="button"
            onClick={logoutUser}
          >
            <SignOutIcon
              size={18}
              aria-label={`Logout ${accounts.user.login}`}
            />
          </button>

          <button
            type="button"
            className={`${footerButtonClass} mr-0`}
            title="Quit Gitify"
            onClick={quitApp}
          >
            <XCircleIcon size={18} aria-label="Quit Gitify" />
          </button>
        </div>
      </div>
    </div>
  );
};

1	import {	2✔
2	ArrowLeftIcon,
3	PersonAddIcon,
4	SignOutIcon,
5	XCircleIcon,
6	} from '@primer/octicons-react';
7	import { ipcRenderer } from 'electron';	2✔
8
9	import {	2✔
10	type FC,
11	useCallback,
12	useContext,
13	useEffect,
14	useMemo,
15	useState,
16	} from 'react';
17	import { useNavigate } from 'react-router-dom';	2✔
18
19	import { FieldCheckbox } from '../components/fields/Checkbox';	2✔
20	import { FieldRadioGroup } from '../components/fields/RadioGroup';	2✔
21	import { AppContext } from '../context/App';	2✔
22	import { Theme } from '../types';	2✔
23	import { apiRequestAuth } from '../utils/api-requests';	2✔
24	import {	2✔
25	openExternalLink,
26	updateTrayIcon,
27	updateTrayTitle,
28	} from '../utils/comms';
29	import Constants from '../utils/constants';	2✔
30	import { generateGitHubAPIUrl } from '../utils/helpers';	2✔
31	import { setTheme } from '../utils/theme';	2✔
32
33	export const SettingsRoute: FC = () => {	2✔
34	const { accounts, settings, updateSetting, logout } = useContext(AppContext);	64✔
35	const navigate = useNavigate();	64✔
36
37	const [isLinux, setIsLinux] = useState<boolean>(false);	64✔
38	const [appVersion, setAppVersion] = useState<string \| null>(null);	64✔
39	const [colorScope, setColorScope] = useState<boolean>(false);	64✔
40
41	const openGitHubReleaseNotes = useCallback((version) => {	64✔
42	openExternalLink(	2✔
43	`https://github.com/${Constants.REPO_SLUG}/releases/tag/v${version}`,
44	);
45	}, []);
46
47	useEffect(() => {	64✔
48	ipcRenderer.invoke('get-platform').then((result: string) => {	32✔
49	setIsLinux(result === 'linux');	32✔
50	});
51
52	ipcRenderer.invoke('get-app-version').then((result: string) => {	32✔
53	setAppVersion(result);	32✔
54	});
55	}, []);
56
57	useMemo(() => {	64✔
58	(async () => {	32✔
59	const response = await apiRequestAuth(	32✔
60	`${generateGitHubAPIUrl(Constants.DEFAULT_AUTH_OPTIONS.hostname)}`,
61	'GET',
62	accounts.token,
63	);
64
65	if (response.headers['x-oauth-scopes'].includes('repo'))	32✔
66	setColorScope(true);	28✔
67	})();
68	}, [accounts.token]);
69
70	ipcRenderer.on('update-native-theme', (_, updatedTheme: Theme) => {	64✔
UNCOV 71	if (settings.theme === Theme.SYSTEM) {	×
UNCOV 72	setTheme(updatedTheme);	×
73	}
74	});
75
76	const logoutUser = useCallback(() => {	64✔
77	logout();	2✔
78	navigate(-1);	2✔
79	updateTrayIcon();	2✔
80	updateTrayTitle();	2✔
81	}, []);
82
83	const quitApp = useCallback(() => {	64✔
84	ipcRenderer.send('app-quit');	2✔
85	}, []);
86
87	const goToEnterprise = useCallback(() => {	64✔
88	return navigate('/login-enterprise', { replace: true });	2✔
89	}, []);
90
91	const footerButtonClass =
92	'hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none';	64✔
93
94	return (	64✔
95	<div
96	className="flex flex-1 flex-col h-screen dark:bg-gray-dark dark:text-white"
97	data-testid="settings"
98	>
99	<div className="flex justify-between items-center mt-2 py-2 mx-8">
100	<button
101	type="button"
102	className="focus:outline-none"
103	title="Go Back"
104	onClick={() => navigate(-1)}	2✔
105	>
106	<ArrowLeftIcon
107	size={20}
108	className="hover:text-gray-400"
109	aria-label="Go Back"
110	/>
111	</button>
112
113	<h3 className="text-lg font-semibold">Settings</h3>
114	</div>
115
116	<div className="flex-grow overflow-x-auto px-8">
117	<fieldset className="mb-3">
118	<legend id="appearance" className="font-semibold mt-2 mb-1">
119	Appearance
120	</legend>
121	<FieldRadioGroup
122	name="theme"
123	label="Theme:"
124	value={settings.theme}
125	options={[
126	{ label: 'System', value: Theme.SYSTEM },
127	{ label: 'Light', value: Theme.LIGHT },
128	{ label: 'Dark', value: Theme.DARK },
129	]}
130	onChange={(evt) => {
131	updateSetting('theme', evt.target.value);	2✔
132	}}
133	/>
134	<FieldCheckbox
135	name="colors"
136	label={`Use GitHub-like state colors${
137	!colorScope ? ' (requires repo scope)' : ''	32✔
138	}`}
139	checked={colorScope && settings.colors}	46✔
140	onChange={(evt) =>
141	colorScope && updateSetting('colors', evt.target.checked)	4✔
142	}
143	disabled={!colorScope}
144	/>
145	<FieldCheckbox
146	name="showAccountHostname"
147	label="Show account hostname"
148	checked={settings.showAccountHostname}
149	onChange={(evt) =>
UNCOV 150	updateSetting('showAccountHostname', evt.target.checked)	×
151	}
152	/>
153	</fieldset>
154
155	<fieldset className="mb-3">
156	<legend id="notifications" className="font-semibold mt-2 mb-1">
157	Notifications
158	</legend>
159	<FieldCheckbox
160	name="showOnlyParticipating"
161	label="Show only participating"
162	checked={settings.participating}
163	onChange={(evt) =>
164	updateSetting('participating', evt.target.checked)	2✔
165	}
166	/>
167	<FieldCheckbox
168	name="showBots"
169	label="Show notifications from Bot accounts"
170	checked={settings.showBots}
171	onChange={(evt) => updateSetting('showBots', evt.target.checked)}	2✔
172	/>
173	<FieldCheckbox
174	name="markAsDoneOnOpen"
175	label="Mark as done on open"
176	checked={settings.markAsDoneOnOpen}
177	onChange={(evt) =>
178	updateSetting('markAsDoneOnOpen', evt.target.checked)	2✔
179	}
180	/>
181	</fieldset>
182
183	<fieldset className="mb-3">
184	<legend id="system" className="font-semibold mt-2 mb-1">
185	System
186	</legend>
187	<FieldCheckbox
188	name="showNotificationsCountInTray"
189	label="Show notifications count in tray"
190	checked={settings.showNotificationsCountInTray}
191	onChange={(evt) =>
192	updateSetting('showNotificationsCountInTray', evt.target.checked)	2✔
193	}
194	/>
195	<FieldCheckbox
196	name="showNotifications"
197	label="Show system notifications"
198	checked={settings.showNotifications}
199	onChange={(evt) =>
200	updateSetting('showNotifications', evt.target.checked)	2✔
201	}
202	/>
203	<FieldCheckbox
204	name="playSound"
205	label="Play sound"
206	checked={settings.playSound}
207	onChange={(evt) => updateSetting('playSound', evt.target.checked)}	2✔
208	/>
209	{!isLinux && (	64✔
210	<FieldCheckbox
211	name="openAtStartUp"
212	label="Open at startup"
213	checked={settings.openAtStartup}
214	onChange={(evt) =>
215	updateSetting('openAtStartup', evt.target.checked)	2✔
216	}
217	/>
218	)}
219	</fieldset>
220	</div>
221
222	<div className="flex justify-between items-center bg-gray-200 dark:bg-gray-darker py-1 px-8">
223	<button
224	type="button"
225	className="font-semibold cursor-pointer"
226	title="View release notes"
227	onClick={() => openGitHubReleaseNotes(appVersion)}	2✔
228	>
229	Gitify v{appVersion}
230	</button>
231	<div>
232	<button
233	type="button"
234	className={footerButtonClass}
235	title="Login with GitHub Enterprise"
236	onClick={goToEnterprise}
237	>
238	<PersonAddIcon
239	size={20}
240	aria-label="Login with GitHub Enterprise"
241	/>
242	</button>
243
244	<button
245	type="button"
246	className={footerButtonClass}
247	title={`Logout ${accounts.user.login}`}
248	role="button"
249	onClick={logoutUser}
250	>
251	<SignOutIcon
252	size={18}
253	aria-label={`Logout ${accounts.user.login}`}
254	/>
255	</button>
256
257	<button
258	type="button"
259	className={`${footerButtonClass} mr-0`}
260	title="Quit Gitify"
261	onClick={quitApp}
262	>
263	<XCircleIcon size={18} aria-label="Quit Gitify" />
264	</button>
265	</div>
266	</div>
267	</div>
268	);
269	};

gitify-app / gitify / 8599716186

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous