blob: 2f7665eefd36f1774df69795d2810cb467f76c32 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
|
// SPDX-FileCopyrightText: 2026 Progmasoft <support@progmasoft.com>
// SPDX-License-Identifier: AGPL-3.0-or-later WITH AdditionRef-Progmasoft-Patent-Grant-1.1
import type { ApplicationCredentials } from "@/lib/credentials";
import { getCredentialsMessages } from "@/lib/credentials-messages";
import type { Locale } from "@/lib/localization";
/** The client identifier and, this once, the client secret of an application. */
export function CredentialsCard({
locale,
title,
credentials,
}: {
locale: Locale;
title: string;
credentials: ApplicationCredentials;
}) {
const { details, kinds } = getCredentialsMessages(locale);
const { application, clientSecret } = credentials;
return (
<div className="credentials-panel">
<h2>{title}</h2>
<p>
<strong>{application.displayName}</strong>{" "}
<span className="credentials-note">
{kinds[application.kind].title}
</span>
</p>
<div className="field-group">
<label>{details.clientId}</label>
<code className="credentials-code credentials-secret">
{application.clientId}
</code>
</div>
{clientSecret ? (
<div className="field-group">
<label>{details.clientSecret}</label>
<code className="credentials-code credentials-secret">
{clientSecret}
</code>
<div className="form-message form-message-error" role="alert">
{details.copyNow}
</div>
</div>
) : (
<p className="credentials-note">{details.noSecret}</p>
)}
<div className="credentials-actions">
<a
className="button"
href={`/credentials/${encodeURIComponent(application.clientId)}`}
>
{application.displayName}
</a>
</div>
</div>
);
}
|