Merge branch 'feat/rewrite-skizzle' of https://github.com/AxaGuilDEv/…

…Skizzle into feat/rewrite-skizzle

rollup.config.js

@@ -25,12 +25,14 @@ export default {
 		nodePolyfills(),
 		svelte({
 			compilerOptions: {
-				// enable run-time checks when not in production
 				dev: !production,
 			},
 			preprocess: createPreprocessors(!production),
 		}),
-		css({ output: 'bundle.css' }),
+		css({
+			output: 'bundle.css',
+			sourceMap: !production,
+		}),
 		resolve({
 			browser: true,
 			dedupe: ['svelte'],

src/components/AzureDevOps/AzureDevOps.svelte

@@ -10,16 +10,18 @@
 	import SearchResults from 'components/SearchResults';
 	import FollowedRepositories from 'components/FollowedRepositories';
 	import Search from 'components/Search';
-	import type { RepositoryType } from 'models/skizzle';
+	import type { ProfileType, RepositoryType } from 'models/skizzle';
 
 	let search: string = '';
 
-	const onSearchSubmit = (repositories: RepositoryType[]) => (
+	const onSearchSubmit = (profile: ProfileType) => async (
 		query: string,
-	): void => {
+	) => {
 		search = query;
 
-		fetchedAzureDevOpsRepositories = repositories.filter(
+		const result = await Service.getRepositories(ProviderEnum.AzureDevOps, { profile });
+
+		fetchedAzureDevOpsRepositories = result.filter(
 			({ projectName, name }) =>
 				name.toLocaleLowerCase().includes(search.toLocaleLowerCase()) ||
 				projectName.toLocaleLowerCase().includes(search.toLocaleLowerCase()),
@@ -44,31 +46,29 @@
 			<AccountSummary {profile} />
 		</section>
 		<div class="content">
-			{#await Service.getRepositories(ProviderEnum.AzureDevOps, { profile })}
-			<p class="loader">Chargement de la liste des repositories...</p>
-			{:then repositories}
-				<section>
-					<AccountTitle>Suivre un nouveau repository</AccountTitle>
-					<p class="intro">
-						Cherchez le nom de son projet et/ou repository associé.
-					</p>
-					<Search
-						onSubmit={onSearchSubmit(repositories)}
-						onCancel={onSearchCancel}
-						disabled={$isFetchingData}
-						placeholder="Rechercher un projet ou un repos"
-					/>
+			<section>
+				<AccountTitle>Suivre un nouveau repository</AccountTitle>
+				<p class="intro">
+					Cherchez le nom de son projet et/ou repository associé.
+				</p>
+				<Search
+					onSubmit={onSearchSubmit(profile)}
+					onCancel={onSearchCancel}
+					disabled={$isFetchingData}
+					placeholder="Rechercher un projet ou un repos"
+				/>
 
-					{#if search}
+				{#if search}
+					{#if $isFetchingData}
+						<p>Recherche en cours...</p>
+					{:else}
 						<SearchResults {search} repos={fetchedAzureDevOpsRepositories} />
 					{/if}
-				</section>
-				<section>
-					<FollowedRepositories {profile} />
-				</section>
-			{:catch}
-				<p class="error">Fetching profile failed.</p>
-			{/await}
+				{/if}
+			</section>
+			<section>
+				<FollowedRepositories {profile} />
+			</section>
 		</div>
 	{:catch}
 		<p class="error">Fetching profile failed.</p>

src/components/FollowedRepositories/FollowedRepositories.svelte

@@ -29,7 +29,6 @@
 		Vos repositories suivis
 		<button
 			title="Partager votre liste"
-			disabled={$isFetchingData}
 			on:click={() => (shareDisplayed = true)}
 		><Icons.Share /></button>
 	</AccountTitle>
@@ -53,7 +52,6 @@
 								repository.gitUrl,
 								`L'url du repository est copiée dans le presse-papiers.`,
 							)}
-						disabled={$isFetchingData}
 						title="Copier l'url de ce repository"
 					>
 						<Icons.Copy />
@@ -74,7 +72,6 @@
 			<ImportExport
 				{followedRepositories}
 				bind:shareDisplayed
-				provider={profile.provider}
 			/>
 		</Modale>
 	{/if}

src/components/ImportExport/ImportExport.svelte

@@ -1,19 +1,17 @@
 <script lang="ts">
 	import { v4 as uuidv4 } from 'uuid';
-  import { isFetchingData, notifications, pullRequests, repositories } from 'shared/stores/default.store';
+  import { notifications, pullRequests, repositories } from 'shared/stores/default.store';
 	import { HighlightSvelte } from "svelte-highlight";
   import { json } from "svelte-highlight/languages";
 	import Tabs from 'components/Tabs';
   import AccountTitle from 'components/AccountTitle';
   import { copyToClipboard, isJson } from 'shared/utils';
   import Icons from 'components/icons';
   import type { RepositoryType, ProviderEnum } from 'models/skizzle';
-  
   import 'svelte-highlight/styles/dark.css';
-import { Service } from 'services';
+  import { Service } from 'services';
 
   export let followedRepositories: RepositoryType[];
-  export let provider: ProviderEnum;
   export let shareDisplayed: boolean;
 
   let currentTab: string = 'import';
@@ -77,7 +75,6 @@ import { Service } from 'services';
     <button
     class="copy"
         on:click={() => copyToClipboard(JSON.stringify(getExportCode(), undefined, 2), 'Code copié dans le presse-papier.')}
-        disabled={$isFetchingData}
         title="Copier l'url de ce repository"
       >
       <Icons.Copy />

src/components/SearchResults/SearchResults.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { checkRepository } from 'utils';
-	import { isFetchingData, repositories } from 'shared/stores/default.store';
+	import { repositories } from 'shared/stores/default.store';
 	import type { RepositoryType } from 'models/skizzle/RepositoryType';
 
 	export let search: string;
@@ -70,11 +70,13 @@
 						type="checkbox"
 						id={repository.repositoryId}
 						checked={$repositories.some(x => x.repositoryId === repository.repositoryId)}
-						on:change={event => checkRepository(event, repository)}
-						disabled={$isFetchingData} />
+						on:change={event => checkRepository(event, repository)} />
 					<label
 						class="follow"
-						for={repository.repositoryId}>{$repositories.some(x => x.repositoryId === repository.repositoryId) ? 'Ne plus suivre' : 'Suivre'}</label>
+						for={repository.repositoryId}
+					>
+						{$repositories.some(x => x.repositoryId === repository.repositoryId) ? 'Ne plus suivre' : 'Suivre'}
+					</label>
 				</li>
 			{/each}
 		</ul>

src/components/Settings/Settings.svelte

@@ -56,6 +56,17 @@
 			</select>
 		</Fieldset>
 
+		<Fieldset
+			title="Proxy"
+		>
+			<label for="proxy">Serveur et port (ex: http://localhost:3000) : </label>
+			<input
+				id="proxy"
+				type="url"
+				bind:value={$settings.proxy}
+			/>
+		</Fieldset>
+
 		<Fieldset
 			title="Theme"
 			intro="Choisissez un theme pour l'interface de Skizzle."

src/components/Tabs/Tabs.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
 	import Icons from 'components/icons';
-	import { isFetchingData } from 'shared/stores/default.store';
 	export let data: any;
 	export let onChange: (value: any) => void;
 	export let current: any;
@@ -15,7 +14,6 @@
 			class="tab"
 			class:current={current === tab || Object.keys(data).length === 1}
 			on:click={() => onChange(tab)}
-			disabled={$isFetchingData}
 		>
 			{#if data[tab].icon}
 				<svelte:component this={data[tab].icon} />

src/electron/electron.ts

@@ -17,6 +17,7 @@ import type { SettingsType } from '../models/skizzle/SettingsType';
 import { SkizzleUpdaterEnum } from '../models/skizzle/SkizzleUpdaterEnum';
 import type { ExportType } from '../models/skizzle/ExportType';
 import { WindowEnum } from '../models/skizzle/WindowEnum';
+import { requester } from './requester';
 
 try {
 	require('electron-reloader')(module);
@@ -76,9 +77,7 @@ const createWindow = () => {
 		window = null;
 	});
 
-	if (!app.isPackaged) {
-		window.webContents.openDevTools();
-	}
+	window.webContents.openDevTools({ mode: 'detach' });
 
 	//@ts-ignore
 	window.on('render-process-gone', () => hangOrCrash(window));
@@ -373,6 +372,14 @@ if (!gotTheLock) {
 		},
 	);
 
+	ipcMain.handle('request', async (event, args) => {
+		const { url, options, settings } = JSON.parse(args);
+
+		options['user-agent'] = window.webContents.session.getUserAgent();
+
+		return requester(url, options, settings);
+	});
+
 	ipcMain.on('notifier', (event, arg) => {
 		if (Notification.isSupported()) {
 			const iconName =

src/electron/requester.ts

@@ -0,0 +1,24 @@
+import type { SettingsType } from '../models/skizzle/SettingsType';
+import type { HeaderType } from '../models/skizzle/HeaderType';
+
+var superagent = require('superagent');
+require('superagent-proxy')(superagent);
+
+export const requester = async (
+	url: string,
+	headers?: HeaderType,
+	settings?: SettingsType,
+) => {
+	try {
+		const result = await superagent
+			.get(url)
+			.retry(3)
+			.proxy(settings.proxy)
+			.set('User-Agent', headers['user-agent'])
+			.auth(headers?.authorization, { type: 'bearer' });
+
+		return result.body;
+	} catch (error) {
+		throw new Error(error);
+	}
+};

src/models/skizzle/HeaderType.ts

@@ -0,0 +1,6 @@
+export type HeaderType = {
+	accept?: string;
+	'content-type'?: string;
+	authorization?: string;
+	'user-agent'?: string;
+};

src/models/skizzle/index.ts

@@ -10,6 +10,7 @@ import type { ReviewType } from './ReviewType';
 import type { SettingsType } from './SettingsType';
 import type { NotificationType } from './NotificationType';
 import type { ExportType } from './ExportType';
+import type { HeaderType } from './HeaderType';
 
 import { ProviderEnum } from './ProviderEnum';
 import { ThemeEnum } from './ThemeEnum';
@@ -32,6 +33,7 @@ export type {
 	UserType,
 	NotificationType,
 	ExportType,
+	HeaderType,
 };
 
 export { ProviderEnum, ThemeEnum, Views, SkizzleUpdaterEnum, WindowEnum };

src/requesters/OAuthAzureDevOps.requester.ts

@@ -16,19 +16,18 @@ import type {
 	AzureDevOpsReviewApiType,
 	AzureDevOpsReviewsApiType,
 } from 'models/api';
+import type { HeaderType } from 'models/skizzle';
 import type { OAuthAzureDevOpsConfigType } from 'providers/OAuthAzureDevOpsConfig.provider';
 import { Requester } from './Requester';
 
 export class OAuthAzureDevOpsRequester extends Requester<OAuthAzureDevOpsConfigType> {
 	private readonly API_VERSION = '6.1-preview';
 
-	protected getHeader(config: OAuthAzureDevOpsConfigType): HeadersInit {
-		const headers = new window.Headers();
-
-		headers.append('Content-Type', 'application/json');
-		headers.append('Authorization', `bearer ${config.access_token}`);
-
-		return headers;
+	protected getHeader(config: OAuthAzureDevOpsConfigType): HeaderType {
+		return {
+			'content-type': 'application/json',
+			authorization: config.access_token,
+		};
 	}
 
 	public async getProfile(userId: string): Promise<AzureDevOpsProfileApiType> {
@@ -41,9 +40,6 @@ export class OAuthAzureDevOpsRequester extends Requester<OAuthAzureDevOpsConfigT
 		return (
 			await super.fetch<AzureDevOpsDescriptorApiType>(
 				`https://vssps.dev.azure.com/_apis/graph/descriptors/${userId}?api-version=${this.API_VERSION}`,
-				{
-					cache: true,
-				},
 			)
 		).value;
 	}
@@ -55,9 +51,6 @@ export class OAuthAzureDevOpsRequester extends Requester<OAuthAzureDevOpsConfigT
 		return (
 			await super.fetch<AzureDevOpsAvatarApiType>(
 				`https://vssps.dev.azure.com/${organizationName}/_apis/graph/Subjects/${descriptor}/avatars?size=large&api-version=${this.API_VERSION}`,
-				{
-					cache: true,
-				},
 			)
 		).value;
 	}

src/requesters/OAuthGithub.requester.ts

@@ -10,17 +10,16 @@ import type {
 	GithubReviewApiType,
 	GithubReviewsApiType,
 } from 'models/api';
+import type { HeaderType } from 'models/skizzle';
 import type { OAuthGithubConfigType } from 'providers/OAuthGithubConfig.provider';
 import { Requester } from './Requester';
 
 export class OAuthGithubRequester extends Requester<OAuthGithubConfigType> {
-	protected getHeader(config: OAuthGithubConfigType): HeadersInit {
-		const headers = new window.Headers();
-
-		headers.append('Accept', 'application/vnd.github.v3+json');
-		headers.append('Authorization', `bearer ${config.access_token}`);
-
-		return headers;
+	protected getHeader(config: OAuthGithubConfigType): HeaderType {
+		return {
+			accept: 'application/vnd.github.v3+json',
+			authorization: config.access_token,
+		};
 	}
 
 	public async getProfile(): Promise<GithubProfileApiType> {
@@ -74,7 +73,7 @@ export class OAuthGithubRequester extends Requester<OAuthGithubConfigType> {
 		pullRequest?: string,
 	): Promise<GithubCommentApiType[]> {
 		return super.fetch<GithubCommentsApiType>(
-			`https://api.github.com/repos/${owner}/${repository}/issues/${pullRequest}/comments?sort=updated`,
+			`https://api.github.com/repos/${owner}/${repository}/pulls/${pullRequest}/comments?sort=updated`,
 		);
 	}