@kinetis/vector-ui 0.0.0-stage → 0.9.1

package/app/composables/useVectorResource.ts

@@ -0,0 +1,305 @@
+import type { VectorActionResponse, VectorAuditEntry, VectorExportFormat, VectorFilterQuery, VectorImportMode, VectorImportPreview, VectorPage, VectorRecord, VectorRecordPermissions, VectorRelationValue, VectorSelection, VectorSort, VectorUploaded, VectorWidgetData } from '#vector/app/types/vector'
+
+export interface VectorListOptions {
+    page?: number
+    perPage?: number
+    sort?: VectorSort[]
+    filter?: VectorFilterQuery
+    q?: string
+    group?: string
+    summaries?: boolean
+    columns?: string[]
+}
+
+export interface VectorRecordResponse {
+    data: VectorRecord
+    permissions: VectorRecordPermissions
+}
+
+/** `filter[status][eq]=active`: the bracketed keys PHP reads back as a nested array. */
+export function filterQuery(filter: VectorFilterQuery | undefined, prefix = 'filter'): Record<string, string> {
+    const query: Record<string, string> = {}
+
+    for (const [key, spec] of Object.entries(filter ?? {})) {
+        if (spec === undefined) continue
+
+        if (Array.isArray(spec)) {
+            // or / and: filter objects of their own, by position
+            spec.forEach((child, index) => Object.assign(query, filterQuery(child, `${prefix}[${key}][${index}]`)))
+        } else if (typeof spec === 'string') {
+            query[`${prefix}[${key}]`] = spec
+        } else {
+            for (const [op, value] of Object.entries(spec)) {
+                if (value !== undefined) query[`${prefix}[${key}][${op}]`] = value
+            }
+        }
+    }
+
+    return query
+}
+
+/** The record endpoints for one resource. */
+export function useVectorResource(slug: MaybeRefOrGetter<string>) {
+    const api = useVectorApi()
+
+    function base() {
+        return `/vector/r/${encodeURIComponent(toValue(slug))}`
+    }
+
+    function listQuery(options: VectorListOptions): Record<string, string | number> {
+        const query: Record<string, string | number> = {}
+
+        if (options.page) {
+            query.page = options.page
+        }
+
+        if (options.perPage) {
+            query.perPage = options.perPage
+        }
+
+        if (options.sort && options.sort.length > 0) {
+            query.sort = options.sort.map(s => (s.order === 'desc' ? '-' : '') + s.field).join(',')
+        }
+
+        if (options.q) {
+            query.q = options.q
+        }
+
+        if (options.group) {
+            query.group = options.group
+        }
+
+        if (options.summaries) {
+            query.summaries = '1'
+        }
+
+        if (options.columns && options.columns.length > 0) {
+            query.columns = options.columns.join(',')
+        }
+
+        return { ...query, ...filterQuery(options.filter) }
+    }
+
+    function list(options: VectorListOptions = {}): Promise<VectorPage> {
+        return api<VectorPage>(base(), { query: listQuery(options) })
+    }
+
+    function related(id: string | number, relation: string, options: VectorListOptions = {}): Promise<VectorPage> {
+        return api<VectorPage>(`${base()}/${encodeURIComponent(String(id))}/${encodeURIComponent(relation)}`, { query: listQuery(options) })
+    }
+
+    function show(id: string | number): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(`${base()}/${encodeURIComponent(String(id))}`)
+    }
+
+    function create(values: Record<string, unknown>): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(base(), { method: 'POST', body: values })
+    }
+
+    function update(id: string | number, values: Record<string, unknown>, version?: string | number | null): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(`${base()}/${encodeURIComponent(String(id))}`, {
+            method: 'PATCH',
+            body: values,
+            headers: version === undefined || version === null ? {} : { 'If-Match': `"${version}"` },
+        })
+    }
+
+    async function remove(id: string | number): Promise<void> {
+        await api(`${base()}/${encodeURIComponent(String(id))}`, { method: 'DELETE' })
+    }
+
+    function removeMany(ids: (string | number)[]): Promise<{ deleted: number }> {
+        return api<{ deleted: number }>(`${base()}/batch`, { method: 'POST', body: { action: 'delete', ids } })
+    }
+
+    function batch(action: 'delete' | 'restore' | 'forceDelete' | 'update', selection: VectorSelection, fields?: Record<string, unknown>): Promise<{ affected: number }> {
+        return api<{ affected: number }>(`${base()}/batch`, { method: 'POST', body: { action, ...selection, ...(fields ? { fields } : {}) } })
+    }
+
+    /** The list's changeset: different values for different records, in one transaction. */
+    function changes(list: { id: number | string, version?: number, values: Record<string, unknown> }[]): Promise<{ data: VectorRecord[] }> {
+        return api<{ data: VectorRecord[] }>(`${base()}/changes`, { method: 'POST', body: { changes: list } })
+    }
+
+    /** Stores one file for a file or image field; the answer's key is the value to write. */
+    function upload(field: string, file: File): Promise<VectorUploaded> {
+        const body = new FormData()
+        body.append('file', file)
+        return api<VectorUploaded>(`${base()}/fields/${encodeURIComponent(field)}/upload`, { method: 'POST', body })
+    }
+
+    /**
+     * A record's stored file, fetched with the API's credentials (an <img src> could not send a bearer token);
+     * with `key`, an image one of its rich-text documents shows from that field's uploads.
+     */
+    function fileBlob(id: string | number, field: string, key?: string): Promise<Blob> {
+        return api<Blob>(`${base()}/${encodeURIComponent(String(id))}/files/${encodeURIComponent(field)}`, { responseType: 'blob', query: key ? { key } : undefined })
+    }
+
+    async function downloadFile(id: string | number, field: string, fallbackName: string): Promise<void> {
+        const response = await asFile(() => api.raw(`${base()}/${encodeURIComponent(String(id))}/files/${encodeURIComponent(field)}`, { responseType: 'blob' }))
+        saveBlob(response._data as Blob, filenameOf(response.headers.get('content-disposition')) ?? fallbackName)
+    }
+
+    function attach(id: string | number, relation: string, ids: (string | number)[]): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(`${base()}/${encodeURIComponent(String(id))}/${encodeURIComponent(relation)}/attach`, { method: 'POST', body: { ids } })
+    }
+
+    function detach(id: string | number, relation: string, ids: (string | number)[]): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(`${base()}/${encodeURIComponent(String(id))}/${encodeURIComponent(relation)}/detach`, { method: 'POST', body: { ids } })
+    }
+
+    async function forceRemove(id: string | number): Promise<void> {
+        await api(`${base()}/${encodeURIComponent(String(id))}`, { method: 'DELETE', query: { force: '1' } })
+    }
+
+    function restore(id: string | number): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(`${base()}/${encodeURIComponent(String(id))}/restore`, { method: 'POST' })
+    }
+
+    /**
+     * Runs an action. A download answers with a file, which lands in the
+     * browser's download list; anything else is the JSON envelope. An
+     * action that declines answers 422 with `type: 'danger'`, which is an
+     * outcome for the dialog to show, not a failure.
+     */
+    async function runAction(name: string, selection: VectorSelection | null, fields: Record<string, unknown>): Promise<VectorActionResponse> {
+        let response
+
+        try {
+            response = await asFile(() => api.raw(`${base()}/actions/${encodeURIComponent(name)}`, {
+                method: 'POST',
+                body: { ...(selection ?? {}), fields },
+                responseType: 'blob',
+            }))
+        } catch (error) {
+            const declined = (error as { status?: number, data?: { type?: string } } | null)
+
+            if (declined?.status === 422 && declined.data?.type === 'danger') {
+                return declined.data as VectorActionResponse
+            }
+
+            throw error
+        }
+
+        const type = response.headers.get('content-type') ?? ''
+
+        if (!type.includes('json')) {
+            saveBlob(response._data as Blob, filenameOf(response.headers.get('content-disposition')) ?? `${name}.csv`)
+
+            return { type: 'download', message: null, url: null, affected: 0 }
+        }
+
+        return JSON.parse(await (response._data as Blob).text()) as VectorActionResponse
+    }
+
+    /** Downloads the CSV, or answers the job the server queued for a large one. */
+    /** A CSV above the inline limit, and every XLSX, comes back as a queued job instead of a file. */
+    async function exportFile(options: VectorListOptions = {}, format: VectorExportFormat = 'csv'): Promise<{ jobId: number } | null> {
+        const response = await asFile(() => api.raw(`${base()}/export`, { query: { ...listQuery({ ...options, page: undefined, perPage: undefined }), format }, responseType: 'blob' }))
+
+        if (response.status === 202) {
+            const queued = JSON.parse(await (response._data as Blob).text()) as { jobId: number }
+
+            return { jobId: queued.jobId }
+        }
+
+        saveBlob(response._data as Blob, filenameOf(response.headers.get('content-disposition')) ?? `${toValue(slug)}.${format}`)
+
+        return null
+    }
+
+    const exportCsv = (options: VectorListOptions = {}) => exportFile(options, 'csv')
+
+    function audit(id: string | number): Promise<{ data: VectorAuditEntry[] }> {
+        return api<{ data: VectorAuditEntry[] }>(`${base()}/${encodeURIComponent(String(id))}/audit`)
+    }
+
+    /** The rows a repeater edits: every child of the record, as the child resource shows one. */
+    function rows(id: string | number, field: string): Promise<{ data: VectorRecord[] }> {
+        return api<{ data: VectorRecord[] }>(`${base()}/${encodeURIComponent(String(id))}/${encodeURIComponent(field)}/rows`)
+    }
+
+    /** Puts back what one history entry changed; 409 when a field changed since. */
+    function revert(id: string | number, entryId: number): Promise<VectorRecordResponse> {
+        return api<VectorRecordResponse>(`${base()}/${encodeURIComponent(String(id))}/audit/${entryId}/revert`, { method: 'POST' })
+    }
+
+    function widget(name: string, range?: string): Promise<{ data: VectorWidgetData }> {
+        return api<{ data: VectorWidgetData }>(`${base()}/widgets/${encodeURIComponent(name)}`, { query: range ? { range } : {} })
+    }
+
+    function importPreview(file: File): Promise<VectorImportPreview> {
+        const body = new FormData()
+        body.append('file', file)
+
+        return api<VectorImportPreview>(`${base()}/import/preview`, { method: 'POST', body })
+    }
+
+    /** `mode` update or upsert matches each row to a record by `key`, a mapped key or unique field. */
+    function importCsv(file: File, mapping: Record<string, string>, mode: VectorImportMode = 'create', key = ''): Promise<{ jobId: number, rows: number }> {
+        const body = new FormData()
+        body.append('file', file)
+        body.append('mapping', JSON.stringify(mapping))
+        body.append('mode', mode)
+        if (mode !== 'create') body.append('key', key)
+
+        return api<{ jobId: number, rows: number }>(`${base()}/import`, { method: 'POST', body })
+    }
+
+    /** `depends` carries the form's values a dependent choice list narrows by. */
+    function options(field: string, search: string, ids: (string | number)[] = [], depends: Record<string, string | number> = {}): Promise<{ data: VectorRelationValue[] }> {
+        const narrowing = Object.fromEntries(Object.entries(depends).map(([name, value]) => [`depends[${name}]`, String(value)]))
+
+        return api<{ data: VectorRelationValue[] }>(`${base()}/fields/${encodeURIComponent(field)}/options`, {
+            query: ids.length > 0 ? { ids: ids.join(',') } : { q: search, ...narrowing },
+        })
+    }
+
+    return { list, related, show, create, update, remove, removeMany, batch, changes, attach, detach, upload, fileBlob, downloadFile, forceRemove, restore, runAction, exportCsv, exportFile, audit, revert, rows, widget, importPreview, importCsv, options }
+}
+
+/**
+ * Runs a request made with `responseType: 'blob'`. ofetch reads the body
+ * as a Blob before it looks at the status, so a 4xx arrives as a Blob of
+ * JSON; this reads that JSON back onto the error, so `status` and `data`
+ * mean what they mean on every other request (422 violations included).
+ */
+export async function asFile<T>(request: () => Promise<T>): Promise<T> {
+    try {
+        return await request()
+    } catch (error) {
+        const failure = error as { data?: unknown } | null
+
+        if (failure?.data instanceof Blob) {
+            const text = await failure.data.text()
+
+            try {
+                failure.data = JSON.parse(text)
+            } catch {
+                failure.data = { error: text }
+            }
+        }
+
+        throw error
+    }
+}
+
+function filenameOf(disposition: string | null): string | undefined {
+    const match = disposition?.match(/filename="([^"]+)"/)
+
+    return match?.[1]
+}
+
+function saveBlob(blob: Blob, filename: string) {
+    if (!import.meta.client) return
+
+    const url = URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = filename
+    document.body.appendChild(link)
+    link.click()
+    link.remove()
+    setTimeout(() => URL.revokeObjectURL(url), 1000)
+}

package/app/composables/useVectorRuntime.ts

@@ -0,0 +1,42 @@
+/**
+ * How this UI was deployed. In hosted mode the PHP application serves the
+ * shell page and injects `window.__VECTOR__` before the bundle loads:
+ * same-origin API, the application's session cookie for authentication,
+ * a CSRF token for writes, and where its login page lives. Standalone
+ * mode has no such object and authenticates with a bearer token against
+ * the API origin runtime config names.
+ */
+export interface VectorHostedConfig {
+    apiBase: string
+    basePath: string
+    authMode: 'cookie'
+    loginUrl: string
+    logoutUrl: string
+    csrfToken: string | null
+    cspNonce: string | null
+    user: { id: number | string, name: string | null } | null
+    branding: import('#vector/app/types/vector').VectorBranding | null
+    extensions: string[]
+    /** The language the server resolved for this user: the shell starts in it. */
+    locale?: string | null
+}
+
+declare global {
+    interface Window {
+        __VECTOR__?: VectorHostedConfig
+    }
+}
+
+export function useVectorRuntime() {
+    const hosted = import.meta.client ? window.__VECTOR__ ?? null : null
+
+    return {
+        hosted: hosted !== null,
+        authMode: hosted ? 'cookie' as const : 'bearer' as const,
+        apiBase: hosted?.apiBase ?? null,
+        loginUrl: hosted?.loginUrl ?? null,
+        logoutUrl: hosted?.logoutUrl ?? null,
+        csrfToken: hosted?.csrfToken ?? null,
+        user: hosted?.user ?? null,
+    }
+}

package/app/composables/useVectorSchema.ts

@@ -0,0 +1,56 @@
+import type { VectorResource, VectorSchema } from '#vector/app/types/vector'
+
+// The latest descriptor request: an older answer arriving after it (the
+// language switched twice, say) must not replace it. One app per page.
+let latestLoad = 0
+
+/**
+ * The descriptor, loaded once per session and shared by every page. The
+ * server's ETag makes a reload cheap; the layer reloads it after login
+ * because the permission overlay is per identity.
+ */
+export function useVectorSchema() {
+    const schema = useState<VectorSchema | null>('vector.schema', () => null)
+    const loading = useState<boolean>('vector.schema.loading', () => false)
+    const api = useVectorApi()
+
+    async function load(force = false): Promise<VectorSchema> {
+        if (schema.value && !force) {
+            adoptMinorUnits(schema.value.minorUnits ?? {})
+            return schema.value
+        }
+
+        loading.value = true
+        const request = ++latestLoad
+
+        try {
+            const answer = await api<VectorSchema>('/vector/schema')
+
+            if (request === latestLoad) {
+                schema.value = answer
+                adoptMinorUnits(answer.minorUnits ?? {})
+            }
+
+            return answer
+        } finally {
+            if (request === latestLoad) loading.value = false
+        }
+    }
+
+    function clear() {
+        schema.value = null
+    }
+
+    function resource(slug: string): VectorResource | undefined {
+        return schema.value?.resources[slug]
+    }
+
+    const menu = computed(() => (schema.value?.menu ?? []).map(group => ({
+        label: group.label,
+        items: group.resources
+            .map(slug => schema.value!.resources[slug])
+            .filter((resource): resource is VectorResource => resource !== undefined),
+    })))
+
+    return { schema, loading, load, clear, resource, menu }
+}

package/app/composables/useVectorT.ts

@@ -0,0 +1,9 @@
+/**
+ * The admin's translation function for a component or composable:
+ * `const { t } = useVectorT()`, then `t('list.selected', { count }, count)`.
+ * `noun(label)` writes a resource label into a sentence in the current
+ * language's case. The same functions are `vt()` and `vnoun()` anywhere else.
+ */
+export function useVectorT() {
+    return { t: vt, noun: vnoun, locale: useNuxtApp().$vectorI18n.global.locale }
+}

package/app/composables/useVectorViews.ts

@@ -0,0 +1,25 @@
+import type { VectorListState, VectorSavedView } from '#vector/app/types/vector'
+
+/** Saved views of one resource's list. */
+export function useVectorViews(slug: MaybeRefOrGetter<string>) {
+    const api = useVectorApi()
+    const base = () => `/vector/views/${encodeURIComponent(toValue(slug))}`
+
+    async function list(): Promise<VectorSavedView[]> {
+        return (await api<{ data: VectorSavedView[] }>(base())).data
+    }
+
+    async function create(name: string, state: VectorListState, shared: boolean, isDefault: boolean, resourceDefault = false): Promise<VectorSavedView> {
+        return (await api<{ data: VectorSavedView }>(base(), { method: 'POST', body: { name, state, shared, isDefault, resourceDefault } })).data
+    }
+
+    async function update(id: number, name: string, state: VectorListState, shared: boolean, isDefault: boolean, resourceDefault = false): Promise<VectorSavedView> {
+        return (await api<{ data: VectorSavedView }>(`${base()}/${id}`, { method: 'PUT', body: { name, state, shared, isDefault, resourceDefault } })).data
+    }
+
+    async function remove(id: number): Promise<void> {
+        await api(`${base()}/${id}`, { method: 'DELETE' })
+    }
+
+    return { list, create, update, remove }
+}

package/app/i18n/ar/actions.ts

@@ -0,0 +1,11 @@
+// The actions area's strings; see common.ts for words every area shares.
+export default {
+    // "Run {action} on {subject}?", with the action's label in bold.
+    runOn: 'تنفيذ {action} على {subject}؟',
+    subjectAll: 'جميع {label} المطابقة ({count})',
+    subjectCount: '{count} {label}',
+    done: 'تم تنفيذ {label}.',
+    declined: 'رُفض الإجراء.',
+    downloadStarted: 'بدأ التنزيل.',
+    queued: 'أُضيف {label} إلى قائمة الانتظار.',
+}

package/app/i18n/ar/common.ts

@@ -0,0 +1,23 @@
+// Words every area shares. Keep a key here only when two areas or more use it.
+export default {
+    save: 'حفظ',
+    cancel: 'إلغاء',
+    create: 'إنشاء',
+    edit: 'تعديل',
+    delete: 'حذف',
+    deleteForever: 'حذف نهائي',
+    restore: 'استعادة',
+    close: 'إغلاق',
+    apply: 'تطبيق',
+    remove: 'إزالة',
+    search: 'بحث',
+    loading: 'جارٍ التحميل…',
+    required: 'مطلوب',
+    none: '—',
+    yes: 'نعم',
+    no: 'لا',
+    download: 'تنزيل',
+    actions: 'الإجراءات',
+    confirm: 'تأكيد',
+    serverRejected: 'رفض الخادم الطلب.',
+}

package/app/i18n/ar/dashboard.ts

@@ -0,0 +1,28 @@
+// The dashboard area's strings; see common.ts for words every area shares.
+export default {
+    title: 'لوحة المعلومات',
+    range: 'النطاق',
+    loading: 'جارٍ التحميل',
+    percent: '{value}%',
+    duration: {
+        minutes: '{value} دقيقة',
+        hours: '{value} ساعة',
+    },
+    partition: {
+        empty: 'لا شيء في هذا النطاق.',
+    },
+    progress: {
+        of: 'من {target}',
+        label: 'التقدم',
+    },
+    stat: {
+        previous: 'مقابل {value} سابقًا',
+    },
+    table: {
+        empty: 'لا شيء لعرضه.',
+        seeAll: 'عرض الكل',
+    },
+    trend: {
+        total: 'الإجمالي {value}',
+    },
+}

package/app/i18n/ar/fields.ts

@@ -0,0 +1,77 @@
+// The fields area's strings; see common.ts for words every area shares.
+export default {
+    cell: {
+        loading: 'جارٍ تحميل {label}',
+    },
+    keyValue: {
+        key: 'المفتاح',
+        value: 'القيمة',
+        entry: 'الإدخال {n}',
+        add: 'إضافة إدخال',
+        remove: 'إزالة الإدخال {n}',
+        more: '+{count} أخرى',
+        repeated: 'مستخدم أكثر من مرة: {keys}. يُحتفظ بالأخير.',
+    },
+    repeater: {
+        add: 'إضافة {label}',
+        remove: 'إزالة {label} {n}',
+        row: '{label} {n}',
+        count: '{count} من {max} كحد أقصى',
+        unavailable: 'لا يمكنك رؤية هذه الصفوف.',
+    },
+    relation: {
+        placeholder: 'اكتب للبحث',
+        dependsFirst: 'يُرجى اختيار {label} أولًا',
+    },
+    upload: {
+        storageKey: 'مفتاح تخزين الملف.',
+        tooLarge: 'حجم الملف أكبر من {size} ميغابايت.',
+        rejected: 'الملف {message}',
+        uploaded: 'تم رفع {name} ({size} كيلوبايت)',
+        theFile: 'الملف',
+        upTo: 'حتى {size} ميغابايت',
+        preview: 'معاينة {label}',
+        remove: 'إزالة {label}',
+    },
+    richtext: {
+        toolbar: 'تنسيق {label}',
+        bold: 'غامق',
+        italic: 'مائل',
+        underline: 'تسطير',
+        strike: 'يتوسطه خط',
+        code: 'تعليمات برمجية',
+        heading: 'عنوان {level}',
+        bulletList: 'قائمة نقطية',
+        orderedList: 'قائمة مرقمة',
+        blockquote: 'اقتباس',
+        codeBlock: 'كتلة تعليمات برمجية',
+        horizontalRule: 'فاصل',
+        link: 'رابط',
+        linkUrl: 'عنوان الرابط',
+        linkRefused: 'يُرجى استخدام رابط http(s) أو mailto أو رابط نسبي',
+        insertTable: 'إدراج جدول',
+        addRow: 'إضافة صف',
+        addColumn: 'إضافة عمود',
+        deleteRow: 'حذف الصف',
+        deleteColumn: 'حذف العمود',
+        deleteTable: 'حذف الجدول',
+        image: 'إدراج صورة',
+        undo: 'تراجع',
+        redo: 'إعادة',
+        source: 'المصدر',
+        visual: 'مرئي',
+        sourceOf: 'مصدر {label}',
+    },
+    rules: {
+        maxLength: 'بحد أقصى {max} من الأحرف',
+        minLength: 'بحد أدنى {min} من الأحرف',
+        email: 'يُرجى إدخال عنوان بريد إلكتروني صالح',
+        url: 'يُرجى إدخال عنوان URL صالح',
+        greaterThan: 'يجب أن تكون القيمة أكبر من {limit}',
+        greaterThanOrEqual: 'يجب ألا تقل القيمة عن {limit}',
+        lessThan: 'يجب أن تكون القيمة أقل من {limit}',
+        lessThanOrEqual: 'يجب ألا تزيد القيمة على {limit}',
+        invalidFormat: 'تنسيق غير صالح',
+        notAllowed: 'قيمة غير مسموح بها',
+    },
+}

package/app/i18n/ar/index.ts

@@ -0,0 +1,12 @@
+import actions from './actions'
+import common from './common'
+import dashboard from './dashboard'
+import fields from './fields'
+import jobs from './jobs'
+import list from './list'
+import record from './record'
+import settings from './settings'
+import shell from './shell'
+
+/** Arabic (machine translation): one object per area of the UI, mirroring en. */
+export default { common, shell, list, record, actions, dashboard, jobs, settings, fields }

package/app/i18n/ar/jobs.ts

@@ -0,0 +1,36 @@
+// The jobs area's strings; see common.ts for words every area shares.
+export default {
+    title: 'المهام',
+    heading: 'مهام الخلفية',
+    columns: {
+        job: 'المهمة',
+        resource: 'المورد',
+        status: 'الحالة',
+        progress: 'التقدم',
+        started: 'وقت البدء',
+    },
+    empty: 'لا توجد مهام بعد. تظهر هنا عمليات التصدير والاستيراد الكبيرة والإجراءات الموضوعة في قائمة الانتظار.',
+    kind: {
+        action: 'إجراء',
+        export: 'تصدير',
+        import: 'استيراد',
+    },
+    status: {
+        queued: 'في قائمة الانتظار',
+        running: 'قيد التشغيل',
+        done: 'مكتملة',
+        failed: 'فاشلة',
+        stalled: 'متوقفة',
+    },
+    detail: {
+        pageTitle: 'المهمة #{id}',
+        fallbackTitle: 'مهمة',
+        started: 'بدأت {date}',
+        finished: 'انتهت {date}',
+        progress: 'تقدم المهمة',
+        processed: 'تمت معالجة {processed}',
+        processedOfTotal: 'تمت معالجة {processed} من {total}',
+        download: 'تنزيل {file}',
+        file: 'الملف',
+    },
+}