Give each call its own page, and a form to answer it

A call now has its address — description, what the volunteer gets, the
commitment added up, level, closing date, project, technologies — and
the application form right there. The landing's call card leads to it
instead of scrolling to the general form, and shows the level in the
visitor's language rather than the API's `mid` or `any`.

The form is the landing's, with a `callSlug` that hides the kind
selector and posts to the new /api/calls/{slug}/apply handler: the API
refuses a `kind` on an application, which is always an offer of time.
Both handlers share one check, core/submission.ts, now tested on its
own.

A call that is filled or closed keeps its page — a link to it may
still be out there — but shows why there is no form, and where to
write instead.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
pigui
2026-09-29 15:02:06 +02:00
parent 439f951f2e
commit b5681a12ac
15 changed files with 625 additions and 92 deletions

View File

@@ -6,6 +6,7 @@ import {
} from '@angular/core';
import { copyFor } from '../core/copy';
import { CallDetail } from './call-detail';
import type { RoutedPageData, RoutedRecord } from '../core/routed-page';
import { ContentPage } from './content-page';
import { MemberDetail } from './member-detail';
@@ -19,7 +20,7 @@ import { ProjectDetail } from './project-detail';
@Component({
selector: 'app-routed-page',
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [ContentPage, MemberDetail, PageShell, ProjectDetail],
imports: [CallDetail, ContentPage, MemberDetail, PageShell, ProjectDetail],
template: `
<app-page-shell [data]="data()" [seo]="seo()">
@if (data().found; as found) {
@@ -39,6 +40,13 @@ import { ProjectDetail } from './project-detail';
[locale]="data().locale"
/>
}
@case ('call') {
<app-call-detail
[call]="found.record"
[copy]="copy()"
[locale]="data().locale"
/>
}
@case ('member') {
<app-member-detail
[member]="found.record"
@@ -99,5 +107,17 @@ export function seoFor(found: RoutedRecord | null): PageSeo | null {
type: 'profile',
};
}
case 'call': {
const call = found.record;
const project = call.project?.title;
return {
title: `Pireon — ${call.title}${project ? ` · ${project}` : ''}`,
description: call.description?.slice(0, 160) || '',
path: call.path,
alternates: call.alternates ?? {},
type: 'article',
};
}
}
}