create-mithaq 0.1.1 → 0.2.0

package/template/templates/asas/src/courses/ui/archive-button.tsx

@@ -1,25 +0,0 @@
-// The portal's own button for `archive`, drawn in the edit page's danger zone
-// as the registry draws its buttons: one click, behind the page's confirm,
-// with the reason written for the viewer in the viewer's locale, where the
-// dashboard asks for one in a dialog.
-import type { ButtonProps } from 'mithaq/admin'
-import { useLocale, useRecord, useUser } from 'mithaq/admin/react'
-import { Button } from '@/components/ui/button'
-
-export function ArchiveButton({ busy, operation, run }: ButtonProps) {
-  const { t } = useLocale()
-  const record = useRecord()
-  const user = useUser()
-  return (
-    <Button
-      type="button"
-      variant="outline"
-      data-archive-button={operation}
-      data-row={String(record?.id ?? '')}
-      disabled={busy || !record}
-      onClick={() => void run({ reason: t('courses.operations.archive.portalReason', 'Archived from the portal by {name}')!.replace('{name}', () => user.name) })}
-    >
-      {t('courses.operations.archive', 'Archive')}
-    </Button>
-  )
-}

package/template/templates/asas/src/courses/ui/no-courses-on-offer.tsx

@@ -1,11 +0,0 @@
-import type { EmptyProps } from 'mithaq/admin'
-import { useKayan, useLocale } from 'mithaq/admin/react'
-
-export function NoCourses({ page }: EmptyProps) {
-  const { t } = useLocale()
-  return (
-    <p data-empty={`${useKayan().name}${page.path}`} className="text-muted-foreground text-sm">
-      {t('courses.noneOnOffer', 'No courses on offer yet.')}
-    </p>
-  )
-}

package/template/templates/asas/src/courses/ui/on-offer.ts

@@ -1,6 +0,0 @@
-// The courses the portal offers: every course not archived. The portal lists
-// these alone, as its screen's `baseFilter` for the kayan, and its home counts
-// these alone. Plain data in a file of its own, so the page that counts reads it
-// without the kayan's declaration. A course with no `archived` value is not
-// archived either.
-export const onOffer = { or: [{ archived: { exists: false } }, { archived: { equals: false } }] }

package/template/templates/asas/src/enrollments/enrollments.ts

@@ -1,137 +0,0 @@
-import { defaultFields, defaultOperations, folderOf } from 'mithaq'
-import { defineKayan, organization } from '../mithaq.ts'
-import { readsPast, user as actor } from '../tenant-access.ts'
-import { activity, appPage, danger, platformList, platformRecord, topPage } from '../pages.ts'
-import { user } from '../kayan/auth/user/user.ts'
-import { sessions } from '../sessions/sessions.ts'
-
-const ui = folderOf(new URL('./ui/', import.meta.url))
-const sessionCell = ui('session-cell.tsx#SessionCell')
-const enrollment = [{ section: 'enrollment', label: { en: 'Enrollment', ar: 'التسجيل' }, fields: ['session', 'student'] }] as const
-
-/**
- * The seats an actor reads, edits and deletes, inside its active organization:
- * every seat of its organization for an actor holding
- * `enrollments.others` and for platform staff, its own seats alone for anyone
- * else. That is the student, whose enrollment keys would otherwise reach every
- * other student's seat, and a custom role a tenant writes without the key.
- * Another's seat answers 404, as a missing row does.
- *
- * The id is read off the actor as an own key, and an actor carrying none reaches
- * no seat. Every read answers from it, a session's join of its enrollments
- * included.
- */
-const ownSeats = ({ user }: { user: unknown }) => {
-  if (readsPast(user, 'enrollments.others')) return true
-  const actor = user && typeof user === 'object' ? (user as Record<string, unknown>) : undefined
-  const id = actor && Object.hasOwn(actor, 'id') ? actor.id : undefined
-  return typeof id === 'string' && id ? { student: { equals: id } } : false
-}
-
-export const enrollments = defineKayan({
-  name: 'enrollments',
-  access: { read: ownSeats, update: ownSeats, delete: ownSeats },
-  fields: {
-    ...defaultFields,
-    organization,
-    // Read as the session's course and its start on every screen, where a
-    // session alone is titled by its start.
-    //
-    // Both are required, so no write makes a seat for nobody or in nothing, and
-    // a session or a person that holds one is not deleted under it: a required
-    // relationship restricts.
-    session: {
-      kind: 'relationship', label: { en: 'Session', ar: 'الحصة' }, relationTo: () => sessions,
-      rules: { required: true },
-      targets: { dashboard: { cell: sessionCell }, portal: { cell: sessionCell }, platform: { cell: sessionCell } },
-    },
-    // A create that names no student enrolls the person making it: the runner's
-    // defaults step fills it from the actor, and a field with a default is one a
-    // create may leave out, at the HTTP boundary too. A role without the column's
-    // key is refused the filled value, so today only the instructor's and the
-    // administrator's API create fills it; the student reads its own seats and
-    // creates none.
-    student: {
-      kind: 'relationship', label: { en: 'Student', ar: 'الطالب' }, relationTo: () => user,
-      rules: { required: true, defaultValue: actor.id },
-    },
-    /**
-     * The field the language names as its soft-delete mark, so a student who
-     * leaves a session is a row this kayan keeps rather than one it removes: an
-     * enrollment is the record that the student was there. It is the one kayan
-     * of this template that takes the mark. Nothing points at an enrollment, so
-     * no child outlives it, and nothing refers to it through a `restrict`
-     * foreign key that a delete would have to release. Nobody supplies the
-     * mark: the runner writes it at the delete.
-     *
-     * `session` and `student` are required, so each restricts, and a session or
-     * a person a marked enrollment still names is not deleted under it.
-     */
-    deletedAt: {
-      kind: 'datetime',
-      label: { en: 'Deleted at', ar: 'تاريخ الحذف' },
-      rules: { providedBy: { create: 'never', update: 'never' } },
-    },
-  },
-  targets: {
-    // Every organization's rows on the platform, read-only, and each row's
-    // record, which only reads. A record is titled by its student, a person the
-    // platform reads, where a session is titled only by its start.
-    platform: {
-      useAsTitle: 'student',
-      pages: {
-        ...platformList('/enrollments', { columns: ['session', 'student', 'organization', 'createdAt'], filters: ['organization', 'session', 'student'], sort: '-createdAt' }),
-        ...platformRecord({
-          path: '/enrollments/:id',
-          main: [{ section: 'enrollment', label: { en: 'Enrollment', ar: 'التسجيل' }, fields: ['session', 'student', 'deletedAt'] }],
-        }),
-      },
-    },
-    service: { operations: defaultOperations },
-    // Both screens list enrollments; the portal's create opens as a drawer over
-    // its list. Titled by the student on the dashboard, as on the platform, so a
-    // tab and a heading tell one seat from another; on the portal, where the
-    // student is most often the viewer, by the session.
-    dashboard: {
-      useAsTitle: 'student',
-      description: {
-        en: 'Which student holds a seat in which session.',
-        ar: 'أي طالب يشغل مقعدا في أي حصة.',
-      },
-      pages: {
-        // The same table every kayan's list is. Searched by the student's name,
-        // the one column of a person a tenant reads, and filtered by session,
-        // student and when the student enrolled, as the course list is.
-        list: { path: '/enrollments', page: appPage([{ layout: 'table', main: [{ list: {
-          columns: ['session', 'student', 'createdAt'],
-          filters: ['session', 'student', 'createdAt'],
-          search: ['student.name'],
-        } }] }]) },
-        create: { path: '/enrollments/new', page: appPage([{ layout: 'record', main: [{ form: enrollment }] }]) },
-        // The editor layout, and the one timestamp worth reading here, named and
-        // read-only: when the student enrolled, beside the organization it
-        // belongs to, read by its name.
-        edit: {
-          path: '/enrollments/:id',
-          page: appPage([{
-            layout: 'record',
-            main: [{ form: enrollment }],
-            side: [{ section: 'record', label: { en: 'Record', ar: 'السجل' }, fields: [{ field: 'organization', readOnly: true }, { field: 'createdAt', readOnly: true }] }, activity],
-            danger: danger(),
-          }]),
-        },
-      },
-    },
-    portal: {
-      useAsTitle: 'session',
-      pages: {
-        list: { path: '/enrollments', page: topPage([{ layout: 'page', main: [{ list: { columns: ['session', 'createdAt'] } }] }]) },
-        // The student too, as the dashboard draws it, so an instructor picks
-        // whom it enrolls. A role without `enrollments.fields.student` is not
-        // projected the field and is drawn the session alone.
-        create: { path: '/enrollments/new', mode: 'drawer', page: topPage([{ layout: 'page', main: [{ form: ['session', 'student'] }] }]) },
-        edit: { path: '/enrollments/:id', page: topPage([{ layout: 'page', main: [{ form: ['session'] }] }]) },
-      },
-    },
-  },
-})

package/template/templates/asas/src/rich-text-nodes.ts

@@ -1,11 +0,0 @@
-// The Lexical node classes this project's rich text is written in: the one
-// list both halves read, the server's write and every screen's editor and
-// viewer, so neither can take a node the other does not. A node of the
-// project's own is spread after the defaults, `[...defaultNodes, CalloutNode]`,
-// and a node that draws React keeps its DOM-free class here and its React
-// subclass in the client file. This project opts in to the upload node, an
-// image of the organization's own `media` inside the text, whose server half
-// refuses one pointing at a kayan that holds no files.
-import { defaultNodes, UploadNode } from 'mithaq/rich-text'
-
-export const richTextNodes = [...defaultNodes, UploadNode]

package/template/templates/asas/src/roles.ts

@@ -1,16 +0,0 @@
-// The subpath, so a page piece reading the fixed roles' labels loads no server code.
-import { platformRoles } from '@asas/auth/platform-roles'
-import type { SystemRoles } from 'mithaq'
-import { tenantRoles } from './tenant-roles.ts'
-
-export { tenantRoles }
-
-/**
- * Every role this project ships, the platform's and the tenants', which is what
- * the access target takes whole: it holds a slug's keys wherever the project's
- * reader answers it. The platform roles are `@asas/auth`'s, because the column
- * they live on is Better Auth's own `user.role` and the admin plugin's roles are
- * built from the same lists. The reader answers them in the platform app alone,
- * and an assignment never names one.
- */
-export const systemRoles = { ...platformRoles, ...tenantRoles } as const satisfies SystemRoles

package/template/templates/asas/src/ui/rich-text-nodes.tsx

@@ -1,15 +0,0 @@
-// What every screen's rich text editor and viewer draw with: this project's
-// own node list, the one its server parses every write with, each class swapped
-// for its React subclass where one extends it, and the `/` menu's picks. A
-// provider each screen names, so no control, read view or panel can take
-// another list.
-import type { ReactNode } from 'react'
-import type { ProviderProps } from 'mithaq/admin'
-import { RichTextContext, defaultPicks, defaultViews, viewsOf } from '@/components/mithaq/rich-text.tsx'
-import { UploadPlugin, UploadView, imagePick } from '@/components/mithaq/upload.tsx'
-import { richTextNodes } from '../rich-text-nodes.ts'
-
-// The upload node's `/` entry "Image" opens its dialog in every editor.
-const value = { nodes: viewsOf(richTextNodes, [...defaultViews, UploadView]), picks: [...defaultPicks, imagePick], Plugin: UploadPlugin }
-
-export const RichTextNodes = ({ children }: ProviderProps<ReactNode>) => <RichTextContext value={value}>{children}</RichTextContext>

package/template/templates/asas/src/ui-platform/organization-actions.tsx

@@ -1,114 +0,0 @@
-// The list's cell for the `slug` column. Rename is drawn only where this actor holds
-// `organization.rename`, and members only where this actor reads them; the route refuses a rename
-// without the key. A rename that lands asks the list behind it to be read again through
-// `mithaq:refresh`, so the list keeps its scroll.
-import { useState, type FormEvent } from 'react'
-import { holds, type CellProps } from 'mithaq/admin'
-import { useAccess, useLocale, useScreen } from 'mithaq/admin/react'
-import { writeQuery } from '@/components/mithaq/list-query.ts'
-import { Button } from '@/components/ui/button'
-import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'
-import { Input } from '@/components/ui/input'
-import { Label } from '@/components/ui/label'
-
-const slugShape = /^[a-z0-9]+(-[a-z0-9]+)*$/
-
-export function OrganizationActions({ value, row }: CellProps) {
-  const { t } = useLocale()
-  const access = useAccess()
-  const screen = useScreen()
-  const renames = holds(access, 'organization.rename')
-  const members = holds(access, 'member.find') && screen.kayan.member?.pages.list !== undefined
-  const [open, setOpen] = useState(false)
-  const [refusal, setRefusal] = useState<string>()
-  const [done, setDone] = useState<string>()
-  /** Said here rather than by the browser's own bubble, which is in the browser's language. */
-  const [wrong, setWrong] = useState<{ name?: string; slug?: string }>({})
-  const id = String(row.id ?? '')
-  const save = async (event: FormEvent<HTMLFormElement>) => {
-    event.preventDefault()
-    const box = (key: string) => (event.currentTarget.elements.namedItem(key) as HTMLInputElement | null)?.value ?? ''
-    const name = box('name')
-    const slug = box('slug')
-    const found = {
-      name: name.trim() ? undefined : t('organization.name.required', 'This field is required.'),
-      slug: !slug ? t('organization.slug.required', 'This field is required.') : slugShape.test(slug) ? undefined : t('platform.slugPattern', 'A slug is lowercase letters and digits joined by single dashes, such as admin-org.'),
-    }
-    setWrong(found)
-    if (found.name || found.slug) return
-    const response = await fetch('/api/platform/organizations/update', {
-      method: 'POST',
-      headers: { 'content-type': 'application/json' },
-      body: JSON.stringify({ id, name, slug }),
-    })
-    if (!response.ok) {
-      const key = ((await response.json().catch(() => null)) as { data?: { key?: string } } | null)?.data?.key
-      return setRefusal((key && t(key)) ?? t('platform.refused', 'The platform refused that action.'))
-    }
-    window.dispatchEvent(new Event('mithaq:refresh'))
-    // A function, so a name holding `$&` is put in as written.
-    setDone((t('platform.renamed', 'The organization is now named {name}.') ?? '').replace('{name}', () => name))
-  }
-  return (
-    <div data-organization={id} className="flex items-center gap-2 whitespace-nowrap">
-      {/* An identifier, read left to right in either locale. */}
-      <span dir="ltr">{String(value ?? '')}</span>
-      {renames ? (
-        <Button size="sm" variant="outline" className="max-sm:h-11" data-action="rename" onClick={() => setOpen(true)}>
-          {t('platform.rename', 'Rename')}
-        </Button>
-      ) : null}
-      {members ? (
-        <Button
-          size="sm"
-          variant="outline"
-          className="max-sm:h-11"
-          data-action="members"
-          nativeButton={false}
-          render={<a href={`${screen.path}${screen.kayan.member!.pages.list!.path}?${new URLSearchParams(writeQuery({ where: { or: [{ and: [{ organizationId: { equals: id } }] }] } }))}`} />}
-        >
-          {t('platform.members', 'Members')}
-        </Button>
-      ) : null}
-      {open ? (
-        <Dialog open onOpenChange={setOpen}>
-          {/* Cancel is the way out, so the primitive's own close, named in
-              English alone, is not drawn beside it. */}
-          <DialogContent showCloseButton={false}>
-            <DialogHeader>
-              <DialogTitle>{t('platform.rename', 'Rename')}</DialogTitle>
-              <DialogDescription aria-live="polite">{done ?? t('platform.renameAbout', 'The new name and slug take the place of the old ones for everyone in this organization.')}</DialogDescription>
-            </DialogHeader>
-            {done ? (
-              <DialogFooter>
-                <DialogClose render={<Button type="button" variant="outline" />}>{t('admin.close', 'Close')}</DialogClose>
-              </DialogFooter>
-            ) : (
-              <form noValidate onSubmit={(event) => void save(event)} className="grid gap-4">
-                <div className="grid gap-2">
-                  <Label htmlFor={`organization-name-${id}`}>{t('organization.name', 'Name')}</Label>
-                  <Input id={`organization-name-${id}`} name="name" required aria-required dir="auto" defaultValue={String(row.name ?? '')} aria-invalid={wrong.name ? true : undefined} aria-describedby={wrong.name ? `organization-name-${id}-error` : undefined} />
-                  {wrong.name ? <p id={`organization-name-${id}-error`} role="alert" className="text-sm text-destructive">{wrong.name}</p> : null}
-                </div>
-                <div className="grid gap-2">
-                  <Label htmlFor={`organization-slug-${id}`}>{t('organization.slug', 'Slug')}</Label>
-                  <Input id={`organization-slug-${id}`} name="slug" required aria-required dir="ltr" pattern={slugShape.source.slice(1, -1)} defaultValue={String(value ?? '')} aria-invalid={wrong.slug ? true : undefined} aria-describedby={wrong.slug ? `organization-slug-${id}-error` : undefined} />
-                  {wrong.slug ? <p id={`organization-slug-${id}-error`} role="alert" className="text-sm text-destructive">{wrong.slug}</p> : null}
-                </div>
-                {refusal ? (
-                  <p role="alert" className="text-sm text-destructive">
-                    {refusal}
-                  </p>
-                ) : null}
-                <DialogFooter>
-                  <DialogClose render={<Button type="button" variant="outline" />}>{t('admin.cancel', 'Cancel')}</DialogClose>
-                  <Button type="submit">{t('admin.save', 'Save')}</Button>
-                </DialogFooter>
-              </form>
-            )}
-          </DialogContent>
-        </Dialog>
-      ) : null}
-    </div>
-  )
-}