@mapcreator/api 5.0.0-alpha.47 → 5.0.0-alpha.49

package/src/api/jobRevision.ts

@@ -1,12 +1,16 @@
 import { type ApiLayerData, type Layer, layerRevivers } from './layer.js';
+import { apiHost, authenticate, token } from '../oauth.js';
 import type { ApiMapstyleSetData } from './mapstyleSet.js';
 import type { ApiLanguageData } from './language.js';
 import {
+  APIError,
   type ApiCommon,
   type ApiCommonData,
   type ApiError,
   type ApiSuccess,
   type Flatten,
+  HTTPError,
+  NetworkError,
   type Revivers,
   defaultListHeader,
   deletedNoneParam,
@@ -196,23 +200,79 @@ export async function listJobRevisionLayers(jobId: number): Promise<Layer[]> {
   return request<ApiLayerArray, Layer>(path, null, defaultListHeader, options);
 }
 
-async function postJobRevisionBuild(jobId: number): Promise<JobCanBuild> {
-  const pathname = `/v1/jobs/${jobId}/revisions/${lastJobRevision}/build`;
-  const path = `${pathname}?${deletedNoneParam}`;
-
-  return request<ApiJobCanBuild, JobCanBuild>(path, null, null, { method: 'POST' });
-}
-
-type OutputUrl = { url: string };
+export type JobRevisionOutputUrl = { url: string };
 
-type ApiOutputUrl = {
-  data: OutputUrl & ApiCommonData;
+export type ApiJobRevisionOutputUrl = {
+  data: JobRevisionOutputUrl & ApiCommonData;
 } & Omit<ApiSuccess, 'data'> | ApiError;
 
-export async function getOutputUrl(jobId: number): Promise<OutputUrl> {
+export async function getJobRevisionOutputUrl(jobId: number): Promise<JobRevisionOutputUrl> {
+  await createJobRevisionBuild(jobId);
+
   const path = `/v1/jobs/${jobId}/revisions/${lastJobRevision}/result/output-url`;
 
-  await postJobRevisionBuild(jobId);
+  return request<ApiJobRevisionOutputUrl, JobRevisionOutputUrl>(path);
+}
+
+export type JobRevisionOutput = { blob: Blob; filename?: string | undefined };
+
+export async function getJobRevisionOutput(jobId: number): Promise<JobRevisionOutput> {
+  await createJobRevisionBuild(jobId);
+
+  const href = `${apiHost}/v1/jobs/${jobId}/revisions/${lastJobRevision}/result/output`;
+  const headers = { ...(token ? { Authorization: token.toString() } : null) };
+  const response = await fetch(href, { headers }).catch((error: Error) => {
+    throw new NetworkError(error?.message ?? error);
+  });
+
+  if (response.ok) {
+    const blob = await response.blob().catch(() => {
+      throw new APIError({ success: false, error: { type: 'TypeError', message: 'Malformed Blob response' } });
+    });
+    const contentDisposition = response.headers.get('Content-Disposition');
+
+    if (contentDisposition) {
+      const filenameRegex = /filename\*\s*=\s*UTF-8''(.+)/i;
+      const filenameMatch = contentDisposition.match(filenameRegex);
+
+      if (filenameMatch?.[1]) {
+        return { blob, filename: filenameMatch[1] };
+      }
+
+      const fallbackRegex = /filename\s*=\s*"([^"]+)"/i;
+      const fallbackMatch = contentDisposition.match(fallbackRegex);
+
+      if (fallbackMatch?.[1]) {
+        return { blob, filename: fallbackMatch[1] };
+      }
+    }
+
+    return { blob };
+  } else {
+    // eslint-disable-next-line default-case
+    switch (response.status) {
+      case 401:
+        await authenticate();
+        break; // NO-OP
+      case 403:
+      case 404:
+      case 406:
+      case 429:
+        throw new APIError(
+          (await response.json().catch(() => ({
+            success: false,
+            error: { type: 'HttpException', message: response.statusText },
+          }))) as ApiError,
+        );
+    }
+
+    throw new HTTPError(response);
+  }
+}
+
+async function createJobRevisionBuild(jobId: number): Promise<string> {
+  const pathname = `/v1/jobs/${jobId}/revisions/${lastJobRevision}/build`;
+  const path = `${pathname}?${deletedNoneParam}`;
 
-  return request<ApiOutputUrl, OutputUrl>(path);
+  return request<ApiCommon, string>(path, null, null, { method: 'POST' });
 }

package/src/api/layer.ts

@@ -4,6 +4,7 @@ export type Layer = {
   id: number;
   name: string;
   description: string;
+  svg: string | null;
 };
 
 export type ApiLayer = {
@@ -13,6 +14,7 @@ export type ApiLayer = {
     path: string;               // The path to the layer
     description: string;        // The description of the layer (searchable, sortable)
     image: string | null;       // The image related to a layer
+    svg: string | null;         // The svg related to a layer
     scale_min: number;          // The minimum scale for the layer (searchable, sortable)
     scale_max: number;          // The maximum scale for the layer (searchable, sortable)
     pangaea_ready: boolean;     // Whether a layer is prepared for Pangaea (searchable, sortable)

package/src/api/resources.ts

@@ -56,7 +56,6 @@ export interface Resources {
   dimensionSets: DimensionSet[];
   mapstyleSets: MapstyleSet[];
   jobTypes: JobType[];
-  hatchingSvgs: Svg[];
   messages: Message[];
   svgSets: SvgSet[];
   layers: Layer[];
@@ -124,7 +123,6 @@ export async function loadResources(): Promise<Resources> {
     dimensionSets: raw.dimensionSets.map(processData, getContext(dimensionSetRevivers)) as DimensionSet[],
     mapstyleSets: raw.mapstyleSets.map(processData, getContext(mapstyleSetRevivers)) as MapstyleSet[],
     jobTypes: raw.jobTypes.map(processData, getContext(jobTypeRevivers)) as JobType[],
-    hatchingSvgs: (raw.hatchingSvgs?.map(processData, getContext(svgRevivers)) ?? []) as Svg[],
     messages: allMessages,
     layers: (raw.layers?.map(processData, getContext(layerRevivers)) ?? []) as Layer[],
     svgSets: (raw.svgSets?.map(processData, getContext(svgSetRevivers)) ?? []) as SvgSet[],

package/src/api/user.ts

@@ -1,6 +1,7 @@
 import { type ApiFontFamilyData, type FontFamily, fontFamilyRevivers } from './fontFamily.js';
 import { type ApiSvgSetData, type SvgSet, svgSetRevivers } from './svgSet.js';
 import { type ApiLayerData, type Layer, layerRevivers } from './layer.js';
+import { type ApiSvgData, type Svg, svgRevivers } from './svg.js';
 import { type JobSearchResult, listJobs } from './apiCommon.js';
 import type { ApiJobShareArray, JobShare } from './jobShare.js';
 import type { RequireAtLeastOne } from 'type-fest';
@@ -194,6 +195,19 @@ export async function listUserFontFamilies(): Promise<FontFamily[]> {
   return request<ApiFontFamilyArray, FontFamily>(path, null, defaultListHeader, options);
 }
 
+export async function listUserHatchingSvgs(): Promise<Svg[]> {
+  const pathname = `/v1/users/${myUser}/hatching-svgs`;
+  const query = getSearchParams({ sort: 'order' });
+  const path = `${pathname}?${query}`;
+  const options = { revivers: svgRevivers };
+
+  type ApiSvgArray = {
+    data: ApiSvgData[];
+  } & Omit<ApiSuccess, 'data'> | ApiError;
+
+  return request<ApiSvgArray, Svg>(path, null, defaultListHeader, options);
+}
+
 export async function listUserJobs(
   userId: number | typeof myUser,
   title: string,

package/src/oauth.ts

@@ -1,7 +1,6 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
 export let apiHost = '';
 
-export const token: {
+export let token: {
   type: string;
   token: string;
   expires: Date;
@@ -13,6 +12,44 @@ let apiClientId = '';
 let callbackUrl = '';
 let oauthScopes = ['*'];
 
+const anchorParams = ['access_token', 'token_type', 'expires_in', 'state'];
+
+const storagePrefix = '_m4n_';
+const statePrefix = 'oauth_state_';
+const storageName = 'api_token';
+
+const dummyTokenExpires = new Date('2100-01-01T01:00:00');
+
+interface AnchorToken {
+  access_token: string;
+  token_type: string;
+  expires_in: string;
+  state: string;
+}
+
+const titleCase = (str: unknown): string => String(str).toLowerCase().replace(/\b\w/g, c => c.toUpperCase());
+
+/**
+ * Setup internal structures to use dummy authentication flow
+ *
+ * @param {string} apiUrl - Full API URL
+ * @param {string} oauthToken - OAuth Token
+ */
+export function initDummyFlow(apiUrl: string, oauthToken: string): void {
+  const parts = oauthToken.includes(' ') ? oauthToken.split(' ', 2) : ['Bearer', oauthToken];
+
+  apiHost = apiUrl.replace(/\/+$/, '');
+  token = {
+    type: titleCase(parts[0]),
+    token: parts[1],
+    expires: dummyTokenExpires,
+
+    toString(): string {
+      return `${this.type} ${this.token}`;
+    },
+  };
+}
+
 /**
  * Setup internal structures to use implicit authentication flow
  *
@@ -27,18 +64,251 @@ export function initImplicitFlow(apiUrl: string, clientId: string, redirectUrl =
   apiClientId = String(clientId);
   callbackUrl = String(redirectUrl || window.location.href.split('#')[0]);
   oauthScopes = scopes;
+
+  {
+    const key = `${storagePrefix}${storageName}`;
+    const data = window.localStorage.getItem(key);
+
+    if (data) {
+      try {
+        const obj = JSON.parse(data) as { type?: unknown; token?: unknown; expires?: unknown };
+
+        if (
+          typeof obj.type === 'string' &&
+          typeof obj.token === 'string' &&
+          typeof obj.expires === 'string' &&
+          new Date(obj.expires) > new Date()
+        ) {
+          token = {
+            type: titleCase(obj.type),
+            token: obj.token,
+            expires: new Date(obj.expires),
+
+            toString(): string {
+              return `${this.type} ${this.token}`;
+            },
+          };
+        } else {
+          window.localStorage.removeItem(key);
+        }
+      } catch (e) {
+        /* */
+      }
+    }
+  }
+
+  {
+    const obj = getAnchorToken();
+
+    if (isAnchorToken(obj)) {
+      // We'll not go there if anchor contains error and/or message
+      // This means that anchor parameters will be preserved for the next processing
+      cleanAnchorParams();
+
+      const expires = new Date(Date.now() + Number(obj.expires_in) * 1000);
+
+      if (isValidState(obj.state) && expires > new Date()) {
+        token = {
+          type: titleCase(obj.token_type),
+          token: obj.access_token,
+          expires,
+
+          toString(): string {
+            return `${this.type} ${this.token}`;
+          },
+        };
+
+        const key = `${storagePrefix}${storageName}`;
+        const data = { type: token.type, token: token.token, expires: expires.toUTCString() };
+
+        window.localStorage.setItem(key, JSON.stringify(data));
+      } else {
+        // TODO: add some logic to handle this
+        // throw Error('Invalid state in url');
+      }
+    }
+  }
+
+  if (authenticated()) {
+    const href = sessionStorage.getItem('redirect-url');
+
+    if (href) {
+      sessionStorage.removeItem('redirect-url');
+      window.history.replaceState(null, document.title, href);
+    }
+  }
 }
 
 export async function authenticate(): Promise<string> | never {
   return new Promise(() => {
-    window.location.assign(`${apiHost}/login`);
+    if (anchorContainsError()) {
+      console.error(getError());
+      cleanAnchorParams();
+    }
+
+    forget();
+
+    sessionStorage.setItem('redirect-url', window.location.href);
+    window.location.assign(buildRedirectUrl());
   });
 }
 
 export function authenticated(): boolean {
-  return true;
+  return token != null && token.expires > new Date() && (
+    token.expires.valueOf() === dummyTokenExpires.valueOf() ||
+    !!window.localStorage.getItem(`${storagePrefix}${storageName}`)
+  );
 }
 
 export async function logout(): Promise<void> {
-  //
+  if (token) {
+    await fetch(`${apiHost}/oauth/logout`, {
+      method: 'POST',
+      headers: {
+        Accept: 'application/json',
+        Authorization: token.toString(),
+      },
+    });
+  }
+
+  forget();
+}
+
+function forget(): void {
+  for (let i = 0; i < window.localStorage.length; ++i) {
+    const key = window.localStorage.key(i);
+
+    if (key?.startsWith(storagePrefix)) {
+      window.localStorage.removeItem(key);
+    }
+  }
+
+  token = null;
+}
+
+function buildRedirectUrl(): string {
+  const queryParams = new URLSearchParams({
+    client_id: apiClientId,
+    redirect_uri: callbackUrl,
+    response_type: 'token',
+    scope: oauthScopes.join(' '),
+    state: generateState(),
+  });
+
+  return `${apiHost}/oauth/authorize?${queryParams}`;
+}
+
+function getAnchorQuery(): string {
+  return window.location.hash.replace(/^#\/?/, '');
+}
+
+function getAnchorParams(): Record<string, unknown> {
+  const query = getAnchorQuery();
+  // eslint-disable-next-line @stylistic/padding-line-between-statements,@typescript-eslint/no-unsafe-return
+  return Object.fromEntries(query.split('&').map(pair => pair.split('=').map(decodeURIComponent)));
+}
+
+function getAnchorToken(): Partial<AnchorToken> {
+  const params = getAnchorParams();
+
+  return Object.fromEntries(Object.entries(params).filter(([key]) => anchorParams.includes(key)));
+}
+
+function isAnchorToken(anchorToken: Partial<AnchorToken>): anchorToken is AnchorToken {
+  const queryKeys = Object.keys(anchorToken);
+
+  return anchorParams.every(key => queryKeys.includes(key));
+}
+
+function cleanAnchorParams(): void {
+  const query = window.location.hash.replace(/^#\/?/, '');
+  const targets = [...anchorParams, 'error', 'message'];
+  const newHash = query
+    .split('&')
+    .filter(pair => !targets.includes(decodeURIComponent(pair.split('=')[0])))
+    .join('&');
+
+  if (newHash) {
+    window.location.hash = newHash;
+  } else {
+    const { origin, pathname, search } = window.location;
+
+    window.history.replaceState(null, document.title, `${origin}${pathname}${search}`);
+  }
+}
+
+function isValidState(state: string): boolean {
+  const key = `${storagePrefix}${statePrefix}${state}`;
+  const found = window.localStorage.getItem(key) != null;
+
+  if (found) {
+    window.localStorage.removeItem(key);
+  }
+
+  return found;
+}
+
+function anchorContainsError(): boolean {
+  return 'error' in getAnchorParams();
+}
+
+function generateState(): string {
+  // @ts-expect-error TS2365
+  // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
+  const state = (([1e7] + -1e3 + -4e3 + -8e3 + -1e11) as string).replace(
+    /[018]/g, // @ts-expect-error TS2362
+    c => (c ^ ((Math.random() * 256) & (0x0f >>> (c >>> 2)))).toString(16),
+  );
+  const key = `${storagePrefix}${statePrefix}${state}`;
+
+  window.localStorage.setItem(key, `${Date.now()}`);
+
+  return state;
+}
+
+class OAuthError extends Error {
+  error: string;
+
+  constructor(message: string, error: unknown) {
+    super(message);
+
+    this.error = String(error);
+  }
+
+  toString(): string {
+    let error = this.error;
+
+    if (error.includes('_')) {
+      error = error.replace('_', ' ').replace(/^./, c => c.toUpperCase());
+    }
+
+    return this.message ? `${error}: ${this.message}` : error;
+  }
+}
+
+function getError(): OAuthError {
+  const params = getAnchorParams();
+
+  return params.message
+    ? new OAuthError(params.message as string, params.error)
+    : new OAuthError(titleCase(params.error), params.error);
+}
+
+/**
+ * Our goal is to support even obsolete platforms (ES2017+ / Node.js 8.10+).
+ * This is a small polyfill for possibly missing method used in our codebase.
+ */
+if (!Object.fromEntries) { // eslint-disable-next-line arrow-body-style
+  Object.fromEntries = <T = never>(entries: Iterable<readonly [string | number, T]>): { [k: string]: T } => {
+    return Array.from(entries).reduce<{ [k: string]: T }>(
+      (object, entry) => {
+        if (!Array.isArray(entry)) {
+          throw new TypeError(`Iterator value ${entry as unknown as string} is not an entry object.`);
+        }
+        object[`${entry[0]}`] = entry[1];
+
+        return object;
+      }, {}
+    );
+  };
 }

package/src/utils.ts

@@ -1,5 +1,5 @@
 import type { CamelCasedProperties, SnakeCasedProperties } from 'type-fest';
-import { apiHost, authenticate } from './oauth.js';
+import { apiHost, authenticate, token } from './oauth.js';
 
 export type Flatten<Type> = Type extends Array<infer Item> ? Item : Type;
 
@@ -233,6 +233,7 @@ function getRequestInit<I extends ApiCommon, O extends Record<string, unknown>>(
   extraHeaders?: Record<string, string> | null,
   extraOptions?: ExtraOptions<I, O>,
 ): RequestInit {
+  const authorization = token ? { Authorization: token.toString() } : null;
   let contentType = null as { 'Content-Type': string } | null;
 
   if (body !== undefined) {
@@ -258,17 +259,10 @@ function getRequestInit<I extends ApiCommon, O extends Record<string, unknown>>(
     }
   }
 
-  const token = document.cookie.split(/; */)
-    .find(pair => pair.startsWith('XSRF-TOKEN'))?.split('=')[1];
+  const headers = { Accept: 'application/json', ...authorization, ...contentType, ...extraHeaders };
   const method = extraOptions?.method ?? (body != null ? 'POST' : 'GET'); // don't touch `!=` please
-  const headers = {
-    Accept: 'application/json',
-    ...contentType,
-    ...extraHeaders,
-    ...(method === 'POST' && token && { 'X-XSRF-Token': decodeURIComponent(token) }),
-  };
 
-  return { body, headers, method, credentials: 'include' } as RequestInit;
+  return { body, headers, method } as RequestInit;
 }
 
 interface Context<I extends ApiCommon, O extends Record<string, unknown>> {