@contember/react-client 1.0.0-alpha.8 → 1.0.0-rc.4

package/src/config/useLoginToken.ts

@@ -0,0 +1,4 @@
+import { useContext } from 'react'
+import { LoginTokenContext } from './LoginTokenContext'
+
+export const useLoginToken = () => useContext(LoginTokenContext)

package/src/content/index.ts

@@ -0,0 +1,3 @@
+export * from './useContentApiRequest'
+export * from './useContentGraphQlClient'
+export * from './useCurrentContentGraphQlClient'

package/src/content/useContentApiRequest.ts

@@ -0,0 +1,6 @@
+import type { UseApiRequestResult } from '../apiRequest'
+import { useApiRequest } from '../apiRequest'
+import { useCurrentContentGraphQlClient } from './useCurrentContentGraphQlClient'
+
+export const useContentApiRequest = <SuccessData>(): UseApiRequestResult<SuccessData> =>
+	useApiRequest<SuccessData>(useCurrentContentGraphQlClient())

package/src/content/useContentGraphQlClient.ts

@@ -0,0 +1,6 @@
+import type { GraphQlClient } from '@contember/client'
+import { formatContentApiRelativeUrl } from '@contember/client'
+import { useGraphQlClient } from '../useGraphQlClient'
+
+export const useContentGraphQlClient = (projectSlug: string, stageSlug: string): GraphQlClient =>
+	useGraphQlClient(formatContentApiRelativeUrl(projectSlug, stageSlug))

package/src/content/useCurrentContentGraphQlClient.ts

@@ -0,0 +1,17 @@
+import type { GraphQlClient } from '@contember/client'
+import { ClientError } from '../ClientError'
+import { useProjectSlug, useStageSlug } from '../project'
+import { useContentGraphQlClient } from './useContentGraphQlClient'
+
+export const useCurrentContentGraphQlClient = (): GraphQlClient => {
+	const projectSlug = useProjectSlug()
+	const stageSlug = useStageSlug()
+
+	if (projectSlug === undefined) {
+		throw new ClientError(`Cannot contact the content API: undefined project slug.`)
+	}
+	if (stageSlug === undefined) {
+		throw new ClientError(`Cannot contact the content API: undefined stage slug.`)
+	}
+	return useContentGraphQlClient(projectSlug, stageSlug)
+}

package/src/index.ts

@@ -0,0 +1,15 @@
+export * from './apiRequest'
+export * from './auth'
+export * from './components'
+export * from './config'
+export * from './content'
+export * from './project'
+export * from './system'
+export * from './tenant'
+export * from './upload'
+
+export * from './ContemberClient'
+export * from './ClientError'
+export * from './useGraphQlClient'
+
+export * from '@contember/client'

package/src/project/ProjectSlugContext.ts

@@ -0,0 +1,3 @@
+import { createContext } from 'react'
+
+export const ProjectSlugContext = createContext<string | undefined>(undefined)

package/src/project/StageSlugContext.ts

@@ -0,0 +1,3 @@
+import { createContext } from 'react'
+
+export const StageSlugContext = createContext<string | undefined>(undefined)

package/src/project/index.ts

@@ -0,0 +1,4 @@
+export * from './ProjectSlugContext'
+export * from './StageSlugContext'
+export * from './useProjectSlug'
+export * from './useStageSlug'

package/src/project/useProjectSlug.ts

@@ -0,0 +1,4 @@
+import { useContext } from 'react'
+import { ProjectSlugContext } from './ProjectSlugContext'
+
+export const useProjectSlug = () => useContext(ProjectSlugContext)

package/src/project/useStageSlug.ts

@@ -0,0 +1,4 @@
+import { useContext } from 'react'
+import { StageSlugContext } from './StageSlugContext'
+
+export const useStageSlug = () => useContext(StageSlugContext)

package/src/system/index.ts

@@ -0,0 +1,3 @@
+export * from './useCurrentSystemGraphQlClient'
+export * from './useSystemApiRequest'
+export * from './useSystemGraphQlClient'

package/src/system/useCurrentSystemGraphQlClient.ts

@@ -0,0 +1,13 @@
+import type { GraphQlClient } from '@contember/client'
+import { ClientError } from '../ClientError'
+import { useProjectSlug } from '../project'
+import { useSystemGraphQlClient } from './useSystemGraphQlClient'
+
+export const useCurrentSystemGraphQlClient = (): GraphQlClient => {
+	const projectSlug = useProjectSlug()
+
+	if (projectSlug === undefined) {
+		throw new ClientError(`Cannot contact the system API: undefined project slug.`)
+	}
+	return useSystemGraphQlClient(projectSlug)
+}

package/src/system/useSystemApiRequest.ts

@@ -0,0 +1,6 @@
+import type { UseApiRequestResult } from '../apiRequest'
+import { useApiRequest } from '../apiRequest'
+import { useCurrentSystemGraphQlClient } from './useCurrentSystemGraphQlClient'
+
+export const useSystemApiRequest = <SuccessData>(): UseApiRequestResult<SuccessData> =>
+	useApiRequest<SuccessData>(useCurrentSystemGraphQlClient())

package/src/system/useSystemGraphQlClient.ts

@@ -0,0 +1,4 @@
+import { formatSystemApiRelativeUrl } from '@contember/client'
+import { useGraphQlClient } from '../useGraphQlClient'
+
+export const useSystemGraphQlClient = (projectSlug: string) => useGraphQlClient(formatSystemApiRelativeUrl(projectSlug))

package/src/tenant/index.ts

@@ -0,0 +1,2 @@
+export * from './useTenantApiRequest'
+export * from './useTenantGraphQlClient'

package/src/tenant/useTenantApiRequest.ts

@@ -0,0 +1,6 @@
+import type { UseApiRequestResult } from '../apiRequest'
+import { useApiRequest } from '../apiRequest'
+import { useTenantGraphQlClient } from './useTenantGraphQlClient'
+
+export const useTenantApiRequest = <SuccessData>(): UseApiRequestResult<SuccessData> =>
+	useApiRequest<SuccessData>(useTenantGraphQlClient())

package/src/tenant/useTenantGraphQlClient.ts

@@ -0,0 +1,4 @@
+import { tenantApiRelativeUrl } from '@contember/client'
+import { useGraphQlClient } from '../useGraphQlClient'
+
+export const useTenantGraphQlClient = () => useGraphQlClient(tenantApiRelativeUrl)

package/src/tsconfig.json

@@ -0,0 +1,9 @@
+{
+	"extends": "../tsconfig.settings.json",
+	"compilerOptions": {
+		"outDir": "../dist/types"
+	},
+	"references": [
+		{ "path": "../../client/src" }
+	]
+}

package/src/upload/FileId.ts

@@ -0,0 +1 @@
+export type FileId = string | number

package/src/upload/FileUploadAction.ts

@@ -0,0 +1,33 @@
+import type { FileUploadProgress } from '@contember/client'
+import type { FileId } from './FileId'
+import type { FileUploadMetadata } from './FileUploadMetadata'
+import type { FileWithMetadata } from './FileWithMetadata'
+
+export type FileUploadAction<Result = unknown, Metadata = undefined> =
+	| {
+			type: 'publishNewestState'
+	  }
+	| {
+			type: 'initialize'
+			files: Iterable<[FileId, FileWithMetadata]>
+	  }
+	| {
+			type: 'startUploading'
+			files: Iterable<[File | FileId, FileUploadMetadata<Metadata>]>
+	  }
+	| {
+			type: 'updateUploadProgress'
+			progress: Iterable<[File | FileId, FileUploadProgress]>
+	  }
+	| {
+			type: 'finishSuccessfully'
+			result: Iterable<[File | FileId, Result]>
+	  }
+	| {
+			type: 'finishWithError'
+			error: Iterable<(File | FileId) | [File | FileId, any]>
+	  }
+	| {
+			type: 'purge'
+			files: Iterable<File | FileId>
+	  }

package/src/upload/FileUploadCompoundState.ts

@@ -0,0 +1,7 @@
+import type { FileId } from './FileId'
+import type { SingleFileUploadState } from './SingleFileUploadState'
+
+export type FileUploadCompoundState<Result = unknown, Metadata = undefined> = Map<
+	FileId,
+	SingleFileUploadState<Result, Metadata>
+>

package/src/upload/FileUploadMetadata.ts

@@ -0,0 +1,6 @@
+import type { FileUploader } from '@contember/client'
+
+export interface FileUploadMetadata<Metadata = undefined> {
+	uploader: FileUploader
+	metadata: Metadata | undefined
+}

package/src/upload/FileUploadMultiTemporalState.ts

@@ -0,0 +1,10 @@
+import type { FileId } from './FileId'
+import type { FileUploadCompoundState } from './FileUploadCompoundState'
+
+export interface FileUploadMultiTemporalState<Result = unknown, Metadata = undefined> {
+	lastUpdateTime: number
+	isLiveStateDirty: boolean
+	fileIdByFile: WeakMap<File, FileId>
+	publicState: FileUploadCompoundState<Result, Metadata>
+	liveState: FileUploadCompoundState<Result, Metadata>
+}

package/src/upload/FileUploadOperations.ts

@@ -0,0 +1,22 @@
+import type { FileUploader } from '@contember/client'
+import type { FileId } from './FileId'
+import type { FileWithMetadata } from './FileWithMetadata'
+
+export interface StartUploadFileOptions<Metadata = undefined> {
+	metadata?: Metadata
+	uploader?: FileUploader
+}
+
+export type InitializeUpload = (files: Iterable<[FileId, File] | File>) => Map<FileId, FileWithMetadata>
+export type StartUpload<Metadata = undefined> = (
+	files: Iterable<FileId | File | [FileId | File, StartUploadFileOptions<Metadata>]>,
+) => void
+export type PurgeUpload = (files: Iterable<FileId | File>) => void
+export type FailUpload = (files: Iterable<FileId | File | [FileId | File, any]>) => void
+
+export interface FileUploadOperations<Metadata = undefined> {
+	initializeUpload: InitializeUpload
+	startUpload: StartUpload<Metadata>
+	purgeUpload: PurgeUpload
+	failUpload: FailUpload
+}

package/src/upload/FileWithMetadata.ts

@@ -0,0 +1,8 @@
+import type { FileId } from './FileId'
+
+export interface FileWithMetadata {
+	file: File
+	fileId: FileId
+	abortController: AbortController
+	previewUrl: string
+}

package/src/upload/SingleFileUploadState.ts

@@ -0,0 +1,35 @@
+import type { FileUploader, FileUploadError } from '@contember/client'
+
+export type SingleFileUploadState<Result = unknown, Metadata = undefined> =
+	| {
+			readyState: 'initializing'
+			abortController: AbortController
+			file: File
+			previewUrl: string
+	  }
+	| {
+			readyState: 'uploading'
+			abortController: AbortController
+			file: File
+			metadata: Metadata
+			previewUrl: string
+			progress: number | undefined
+			uploader: FileUploader
+	  }
+	| {
+			readyState: 'success'
+			file: File
+			metadata: Metadata
+			previewUrl: string
+			result: Result
+			uploader: FileUploader
+	  }
+	| {
+			readyState: 'error'
+			errors: FileUploadError[] | undefined
+			rawError: any
+			file: File
+			metadata: Metadata | undefined
+			previewUrl: string
+			uploader: FileUploader | undefined
+	  }

package/src/upload/fileUploadReducer.ts

@@ -0,0 +1,185 @@
+import { FileUploadError } from '@contember/client'
+import { assertNever } from '../utils'
+import type { FileId } from './FileId'
+import type { FileUploadAction } from './FileUploadAction'
+import type { FileUploadMultiTemporalState } from './FileUploadMultiTemporalState'
+import { toFileId } from './toFileId'
+
+export const initializeFileUploadState = <Result = unknown, Metadata = undefined>(): FileUploadMultiTemporalState<
+	Result,
+	Metadata
+> => ({
+	lastUpdateTime: 0,
+	fileIdByFile: new WeakMap<File, FileId>(),
+	liveState: new Map(),
+	publicState: new Map(),
+	isLiveStateDirty: false,
+})
+
+export const fileUploadReducer = <Result = unknown, Metadata = undefined>(
+	previousState: FileUploadMultiTemporalState<Result, Metadata>,
+	action: FileUploadAction<Result, Metadata>,
+): FileUploadMultiTemporalState<Result, Metadata> => {
+	const publishNewState = (): FileUploadMultiTemporalState<Result, Metadata> => ({
+		publicState: previousState.liveState,
+		fileIdByFile: previousState.fileIdByFile,
+		lastUpdateTime: previousState.lastUpdateTime,
+		isLiveStateDirty: false,
+
+		// Immediately make the live state referentially unequal so that this doesn't have to happen during each action
+		// several times between two publishes.
+		liveState: new Map(previousState.liveState),
+	})
+	const getNewDirtyState = (): FileUploadMultiTemporalState<Result, Metadata> => ({
+		fileIdByFile: previousState.fileIdByFile,
+		liveState: previousState.liveState,
+		publicState: previousState.publicState,
+		isLiveStateDirty: true,
+		lastUpdateTime: Date.now(),
+	})
+	switch (action.type) {
+		case 'publishNewestState': {
+			return publishNewState()
+		}
+		case 'initialize': {
+			for (const [fileId, metadata] of action.files) {
+				// Deliberately allowing starting a new upload with the same id
+
+				previousState.liveState.set(fileId, {
+					readyState: 'initializing',
+					abortController: metadata.abortController,
+					previewUrl: metadata.previewUrl,
+					file: metadata.file,
+				})
+				previousState.fileIdByFile.set(metadata.file, fileId)
+			}
+			return publishNewState() /* Making the feedback about new files immediate*/
+		}
+		case 'startUploading': {
+			for (const [fileOrId, metadata] of action.files) {
+				const fileId = toFileId(previousState, fileOrId)
+				const fileState = previousState.liveState.get(fileId)
+
+				if (fileState === undefined || fileState.readyState !== 'initializing') {
+					continue
+				}
+
+				previousState.liveState.set(fileId, {
+					readyState: 'uploading',
+					abortController: fileState.abortController,
+					file: fileState.file,
+					metadata: metadata.metadata!, // If the user didn't supply the metadata, then that's on them.
+					previewUrl: fileState.previewUrl,
+					progress: undefined,
+					uploader: metadata.uploader,
+				})
+			}
+			return publishNewState() /* Making the feedback about started upload immediate*/
+		}
+		case 'finishSuccessfully': {
+			for (const [fileOrId, result] of action.result) {
+				const fileId = toFileId(previousState, fileOrId)
+				const previousFileState = previousState.liveState.get(fileId)
+				if (previousFileState === undefined || previousFileState.readyState !== 'uploading') {
+					continue
+				}
+				previousState.liveState.set(fileId, {
+					readyState: 'success',
+					file: previousFileState.file,
+					metadata: previousFileState.metadata,
+					previewUrl: previousFileState.previewUrl,
+					result,
+					uploader: previousFileState.uploader,
+				})
+			}
+			// return publishNewState() // Making the feedback about successful upload immediate.
+			return getNewDirtyState()
+		}
+		case 'finishWithError': {
+			for (const errorSpec of action.error) {
+				let fileOrId: File | FileId
+				let rawError: unknown
+
+				if (Array.isArray(errorSpec)) {
+					[fileOrId, rawError] = errorSpec
+				} else {
+					fileOrId = errorSpec
+					rawError = undefined
+				}
+
+				const errors: FileUploadError[] = []
+
+				if (rawError instanceof FileUploadError) {
+					errors.push(rawError)
+				} else if (Array.isArray(rawError)) {
+					for (const error of rawError) {
+						if (error instanceof FileUploadError) {
+							errors.push(error)
+						}
+					}
+				}
+
+				const fileId = toFileId(previousState, fileOrId)
+				const previousFileState = previousState.liveState.get(fileId)
+				if (
+					previousFileState === undefined ||
+					(previousFileState.readyState !== 'initializing' && previousFileState.readyState !== 'uploading')
+				) {
+					continue
+				}
+				const uploader = previousFileState.readyState === 'uploading' ? previousFileState.uploader : undefined
+				const metadata = previousFileState.readyState === 'uploading' ? previousFileState.metadata : undefined
+				previousState.liveState.set(fileId, {
+					readyState: 'error',
+					errors: errors.length ? errors : undefined,
+					rawError,
+					file: previousFileState.file,
+					metadata,
+					previewUrl: previousFileState.previewUrl,
+					uploader,
+				})
+			}
+			return getNewDirtyState() // Bad news can wait.
+		}
+		case 'purge': {
+			let atLeastOnePurged = false
+			for (const fileOrId of action.files) {
+				const fileId = toFileId(previousState, fileOrId)
+				const fileState = previousState.liveState.get(fileId)
+
+				if (fileState === undefined) {
+					continue
+				}
+				atLeastOnePurged = true
+				if (fileState.readyState === 'initializing' || fileState.readyState === 'uploading') {
+					fileState.abortController.abort() // This is a bit naughty… We shouldn't do this from here.
+				}
+				previousState.liveState.delete(fileId)
+			}
+			if (atLeastOnePurged) {
+				return getNewDirtyState()
+			}
+			return previousState
+		}
+		case 'updateUploadProgress': {
+			for (const [fileOrId, { progress }] of action.progress) {
+				const fileId = toFileId(previousState, fileOrId)
+				const previousFileState = previousState.liveState.get(fileId)
+				if (progress === undefined || previousFileState === undefined || previousFileState.readyState !== 'uploading') {
+					continue
+				}
+				previousState.liveState.set(fileId, {
+					readyState: 'uploading',
+					file: previousFileState.file,
+					uploader: previousFileState.uploader,
+					abortController: previousFileState.abortController,
+					previewUrl: previousFileState.previewUrl,
+					metadata: previousFileState.metadata,
+					progress,
+				})
+			}
+			return getNewDirtyState()
+		}
+	}
+	assertNever(action)
+}

package/src/upload/index.ts

@@ -0,0 +1,15 @@
+export * from './useFileUpload'
+
+export type { FileId } from './FileId'
+export type { FileUploadCompoundState } from './FileUploadCompoundState'
+export type { FileUploadMetadata } from './FileUploadMetadata'
+export type {
+	StartUploadFileOptions,
+	StartUpload,
+	FileUploadOperations,
+	InitializeUpload,
+	PurgeUpload,
+	FailUpload,
+} from './FileUploadOperations'
+export type { FileWithMetadata } from './FileWithMetadata'
+export type { SingleFileUploadState } from './SingleFileUploadState'

package/src/upload/toFileId.ts

@@ -0,0 +1,12 @@
+import type { FileId } from './FileId'
+import type { FileUploadMultiTemporalState } from './FileUploadMultiTemporalState'
+
+export const toFileId = <Result = unknown, Metadata = undefined>(
+	state: FileUploadMultiTemporalState<Result, Metadata>,
+	fileOrId: File | FileId,
+) => {
+	if (fileOrId instanceof File) {
+		return state.fileIdByFile.get(fileOrId)! // Should we throw instead of the yolo "!"?
+	}
+	return fileOrId
+}