refactor: api, apiGet関数をosから@/scripts/api.tsに分離する (#9510)
* split api?
* fix
* ✌️
* no vue split?
* Revert "no vue split?"
This reverts commit 27ccec971e2925184a58da65c3472655def2617c.
			
			
This commit is contained in:
		
							parent
							
								
									1453a0f5cf
								
							
						
					
					
						commit
						6b37c09274
					
				
					 2 changed files with 81 additions and 80 deletions
				
			
		|  | @ -4,89 +4,11 @@ import { Component, markRaw, Ref, ref, defineAsyncComponent } from 'vue'; | ||||||
| import { EventEmitter } from 'eventemitter3'; | import { EventEmitter } from 'eventemitter3'; | ||||||
| import insertTextAtCursor from 'insert-text-at-cursor'; | import insertTextAtCursor from 'insert-text-at-cursor'; | ||||||
| import * as Misskey from 'misskey-js'; | import * as Misskey from 'misskey-js'; | ||||||
| import { apiUrl, url } from '@/config'; |  | ||||||
| import MkPostFormDialog from '@/components/MkPostFormDialog.vue'; | import MkPostFormDialog from '@/components/MkPostFormDialog.vue'; | ||||||
| import MkWaitingDialog from '@/components/MkWaitingDialog.vue'; | import MkWaitingDialog from '@/components/MkWaitingDialog.vue'; | ||||||
| import { MenuItem } from '@/types/menu'; | import { MenuItem } from '@/types/menu'; | ||||||
| import { $i } from '@/account'; | import { pendingApiRequestsCount, api, apiGet } from '@/scripts/api'; | ||||||
| 
 | export { pendingApiRequestsCount, api, apiGet }; | ||||||
| export const pendingApiRequestsCount = ref(0); |  | ||||||
| 
 |  | ||||||
| const apiClient = new Misskey.api.APIClient({ |  | ||||||
| 	origin: url, |  | ||||||
| }); |  | ||||||
| 
 |  | ||||||
| export const api = ((endpoint: string, data: Record<string, any> = {}, token?: string | null | undefined) => { |  | ||||||
| 	pendingApiRequestsCount.value++; |  | ||||||
| 
 |  | ||||||
| 	const onFinally = () => { |  | ||||||
| 		pendingApiRequestsCount.value--; |  | ||||||
| 	}; |  | ||||||
| 
 |  | ||||||
| 	const promise = new Promise((resolve, reject) => { |  | ||||||
| 		// Append a credential
 |  | ||||||
| 		if ($i) (data as any).i = $i.token; |  | ||||||
| 		if (token !== undefined) (data as any).i = token; |  | ||||||
| 
 |  | ||||||
| 		// Send request
 |  | ||||||
| 		window.fetch(endpoint.indexOf('://') > -1 ? endpoint : `${apiUrl}/${endpoint}`, { |  | ||||||
| 			method: 'POST', |  | ||||||
| 			body: JSON.stringify(data), |  | ||||||
| 			credentials: 'omit', |  | ||||||
| 			cache: 'no-cache', |  | ||||||
| 			headers: { |  | ||||||
| 				'Content-Type': 'application/json', |  | ||||||
| 			}, |  | ||||||
| 		}).then(async (res) => { |  | ||||||
| 			const body = res.status === 204 ? null : await res.json(); |  | ||||||
| 
 |  | ||||||
| 			if (res.status === 200) { |  | ||||||
| 				resolve(body); |  | ||||||
| 			} else if (res.status === 204) { |  | ||||||
| 				resolve(); |  | ||||||
| 			} else { |  | ||||||
| 				reject(body.error); |  | ||||||
| 			} |  | ||||||
| 		}).catch(reject); |  | ||||||
| 	}); |  | ||||||
| 
 |  | ||||||
| 	promise.then(onFinally, onFinally); |  | ||||||
| 
 |  | ||||||
| 	return promise; |  | ||||||
| }) as typeof apiClient.request; |  | ||||||
| 
 |  | ||||||
| export const apiGet = ((endpoint: string, data: Record<string, any> = {}) => { |  | ||||||
| 	pendingApiRequestsCount.value++; |  | ||||||
| 
 |  | ||||||
| 	const onFinally = () => { |  | ||||||
| 		pendingApiRequestsCount.value--; |  | ||||||
| 	}; |  | ||||||
| 
 |  | ||||||
| 	const query = new URLSearchParams(data); |  | ||||||
| 
 |  | ||||||
| 	const promise = new Promise((resolve, reject) => { |  | ||||||
| 		// Send request
 |  | ||||||
| 		window.fetch(`${apiUrl}/${endpoint}?${query}`, { |  | ||||||
| 			method: 'GET', |  | ||||||
| 			credentials: 'omit', |  | ||||||
| 			cache: 'default', |  | ||||||
| 		}).then(async (res) => { |  | ||||||
| 			const body = res.status === 204 ? null : await res.json(); |  | ||||||
| 
 |  | ||||||
| 			if (res.status === 200) { |  | ||||||
| 				resolve(body); |  | ||||||
| 			} else if (res.status === 204) { |  | ||||||
| 				resolve(); |  | ||||||
| 			} else { |  | ||||||
| 				reject(body.error); |  | ||||||
| 			} |  | ||||||
| 		}).catch(reject); |  | ||||||
| 	}); |  | ||||||
| 
 |  | ||||||
| 	promise.then(onFinally, onFinally); |  | ||||||
| 
 |  | ||||||
| 	return promise; |  | ||||||
| }) as typeof apiClient.request; |  | ||||||
| 
 | 
 | ||||||
| export const apiWithDialog = (( | export const apiWithDialog = (( | ||||||
| 	endpoint: string, | 	endpoint: string, | ||||||
|  |  | ||||||
							
								
								
									
										79
									
								
								packages/frontend/src/scripts/api.ts
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										79
									
								
								packages/frontend/src/scripts/api.ts
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,79 @@ | ||||||
|  | import { Endpoints } from 'misskey-js/built/api.types'; | ||||||
|  | import { ref } from 'vue'; | ||||||
|  | import { apiUrl } from '@/config'; | ||||||
|  | import { $i } from '@/account'; | ||||||
|  | export const pendingApiRequestsCount = ref(0); | ||||||
|  | 
 | ||||||
|  | // Implements Misskey.api.ApiClient.request
 | ||||||
|  | export function api<E extends keyof Endpoints, P extends Endpoints[E]['req']>(endpoint: E, data: P = {} as any, token?: string | null | undefined): Promise<Endpoints[E]['res']> { | ||||||
|  | 	pendingApiRequestsCount.value++; | ||||||
|  | 
 | ||||||
|  | 	const onFinally = () => { | ||||||
|  | 		pendingApiRequestsCount.value--; | ||||||
|  | 	}; | ||||||
|  | 
 | ||||||
|  | 	const promise = new Promise<Endpoints[E]['res'] | void>((resolve, reject) => { | ||||||
|  | 		// Append a credential
 | ||||||
|  | 		if ($i) (data as any).i = $i.token; | ||||||
|  | 		if (token !== undefined) (data as any).i = token; | ||||||
|  | 
 | ||||||
|  | 		// Send request
 | ||||||
|  | 		window.fetch(endpoint.indexOf('://') > -1 ? endpoint : `${apiUrl}/${endpoint}`, { | ||||||
|  | 			method: 'POST', | ||||||
|  | 			body: JSON.stringify(data), | ||||||
|  | 			credentials: 'omit', | ||||||
|  | 			cache: 'no-cache', | ||||||
|  | 			headers: { | ||||||
|  | 				'Content-Type': 'application/json', | ||||||
|  | 			}, | ||||||
|  | 		}).then(async (res) => { | ||||||
|  | 			const body = res.status === 204 ? null : await res.json(); | ||||||
|  | 
 | ||||||
|  | 			if (res.status === 200) { | ||||||
|  | 				resolve(body); | ||||||
|  | 			} else if (res.status === 204) { | ||||||
|  | 				resolve(); | ||||||
|  | 			} else { | ||||||
|  | 				reject(body.error); | ||||||
|  | 			} | ||||||
|  | 		}).catch(reject); | ||||||
|  | 	}); | ||||||
|  | 
 | ||||||
|  | 	promise.then(onFinally, onFinally); | ||||||
|  | 
 | ||||||
|  | 	return promise; | ||||||
|  | }; | ||||||
|  | 
 | ||||||
|  | // Implements Misskey.api.ApiClient.request
 | ||||||
|  | export function apiGet<E extends keyof Endpoints, P extends Endpoints[E]['req']>(endpoint: E, data: P = {} as any): Promise<Endpoints[E]['res']> { | ||||||
|  | 	pendingApiRequestsCount.value++; | ||||||
|  | 
 | ||||||
|  | 	const onFinally = () => { | ||||||
|  | 		pendingApiRequestsCount.value--; | ||||||
|  | 	}; | ||||||
|  | 
 | ||||||
|  | 	const query = new URLSearchParams(data as any); | ||||||
|  | 
 | ||||||
|  | 	const promise = new Promise<Endpoints[E]['res'] | void>((resolve, reject) => { | ||||||
|  | 		// Send request
 | ||||||
|  | 		window.fetch(`${apiUrl}/${endpoint}?${query}`, { | ||||||
|  | 			method: 'GET', | ||||||
|  | 			credentials: 'omit', | ||||||
|  | 			cache: 'default', | ||||||
|  | 		}).then(async (res) => { | ||||||
|  | 			const body = res.status === 204 ? null : await res.json(); | ||||||
|  | 
 | ||||||
|  | 			if (res.status === 200) { | ||||||
|  | 				resolve(body); | ||||||
|  | 			} else if (res.status === 204) { | ||||||
|  | 				resolve(); | ||||||
|  | 			} else { | ||||||
|  | 				reject(body.error); | ||||||
|  | 			} | ||||||
|  | 		}).catch(reject); | ||||||
|  | 	}); | ||||||
|  | 
 | ||||||
|  | 	promise.then(onFinally, onFinally); | ||||||
|  | 
 | ||||||
|  | 	return promise; | ||||||
|  | }; | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue