@cratis/showrunner.usher.react 0.0.0-bootstrap.0 → 0.0.0-stage

package/Issues/MyIssues/MyIssuesDialog.tsx

@@ -1,64 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { Button, Switch } from '@cratis/components/Common';
-import { Dialog, DialogInitialFocus } from '@cratis/components/Dialogs';
-import { Guid } from '@cratis/fundamentals';
-import { useReducer } from 'react';
-import { BugIcon } from '../../Icons.js';
-import { UsherBoundary } from '../../Provider/UsherBoundary.js';
-import { useUsherLabels } from '../../Provider/UsherContext.js';
-import { IssueView } from '../IssueView/IssueView.js';
-import { IssueList } from './IssueList.js';
-import { navigate, startNavigation } from './MyIssuesNavigation.js';
-
-/**
- * Props for {@link MyIssuesDialog}.
- */
-export interface MyIssuesDialogProps {
-    /** The issue to open on; the list of issues when not given. */
-    issueId?: Guid;
-
-    /** Opens the report a problem dialog; no report button when not given. */
-    onReportIssue?: () => void;
-}
-
-/**
- * The my issues side sheet: the signed-in reporter's issues, and one issue at a time with its conversation. Open it
- * with `useDialog`.
- */
-export const MyIssuesDialog = ({ issueId, onReportIssue }: MyIssuesDialogProps) => {
-    const labels = useUsherLabels();
-    const [navigation, dispatch] = useReducer(navigate, issueId, startNavigation);
-    if (navigation.requestedIssueId !== issueId) {
-        dispatch({ type: 'requested', issueId });
-    }
-
-    return (
-        <Dialog
-            title={labels.myIssues.title}
-            subtitle={labels.myIssues.description}
-            placement='end'
-            width='720px'
-            buttons={null}
-            dismissable
-            initialFocus={DialogInitialFocus.Content}
-            closeAriaLabel={labels.common.close}>
-            <UsherBoundary>
-                {navigation.openIssueId
-                    ? <IssueView issueId={navigation.openIssueId} onBack={() => dispatch({ type: 'back' })} />
-                    : (
-                        <div className='usher-my-issues'>
-                            <div className='usher-my-issues__toolbar'>
-                                {onReportIssue && (
-                                    <Button variant='solid' tone='accent' size='small' icon={<BugIcon />} label={labels.myIssues.reportProblem} onClick={onReportIssue} />
-                                )}
-                                <Switch label={labels.myIssues.showClosed} checked={navigation.showClosed} onChange={showClosed => dispatch({ type: 'showClosedChanged', showClosed })} />
-                            </div>
-                            <IssueList showClosed={navigation.showClosed} onOpen={issue => dispatch({ type: 'opened', issueId: issue.id })} />
-                        </div>
-                    )}
-            </UsherBoundary>
-        </Dialog>
-    );
-};

package/Issues/MyIssues/MyIssuesNavigation.ts

@@ -1,61 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { Guid } from '@cratis/fundamentals';
-
-/**
- * Where the my issues side sheet is: the list, or one issue.
- */
-export interface MyIssuesNavigation {
-    /** The issue shown; the list when not set. */
-    readonly openIssueId?: Guid;
-
-    /** The issue the side sheet was last asked to open on, so a new request moves to it. */
-    readonly requestedIssueId?: Guid;
-
-    /** Whether the list shows closed issues too. */
-    readonly showClosed: boolean;
-}
-
-/**
- * Something that moves the my issues side sheet.
- */
-export type MyIssuesNavigationAction =
-    | { readonly type: 'requested'; readonly issueId?: Guid }
-    | { readonly type: 'opened'; readonly issueId: Guid }
-    | { readonly type: 'back' }
-    | { readonly type: 'showClosedChanged'; readonly showClosed: boolean };
-
-/**
- * Gets where the side sheet starts: on the issue asked for, or on the list of open issues.
- * @param issueId The issue to open on; the list when not given.
- * @returns The {@link MyIssuesNavigation}.
- */
-export function startNavigation(issueId?: Guid): MyIssuesNavigation {
-    return { openIssueId: issueId, requestedIssueId: issueId, showClosed: false };
-}
-
-/**
- * Moves the side sheet.
- * @param navigation Where the side sheet is.
- * @param action What moves it.
- * @returns Where it is after.
- */
-export function navigate(navigation: MyIssuesNavigation, action: MyIssuesNavigationAction): MyIssuesNavigation {
-    switch (action.type) {
-        case 'requested':
-            return sameIssue(navigation.requestedIssueId, action.issueId)
-                ? navigation
-                : { ...navigation, openIssueId: action.issueId, requestedIssueId: action.issueId };
-        case 'opened':
-            return { ...navigation, openIssueId: action.issueId };
-        case 'back':
-            return { ...navigation, openIssueId: undefined };
-        case 'showClosedChanged':
-            return { ...navigation, showClosed: action.showClosed };
-    }
-}
-
-function sameIssue(left?: Guid, right?: Guid): boolean {
-    return left === right || (left !== undefined && right !== undefined && left.equals(right));
-}

package/Issues/MyIssues/index.ts

@@ -1,6 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-export * from './IssueList.js';
-export * from './MyIssuesDialog.js';
-export * from './MyIssuesNavigation.js';

package/Issues/MyIssuesList.ts

@@ -1,33 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { ReportedIssue } from '@cratis/showrunner.usher';
-import { isClosed } from './issueStates.js';
-
-/**
- * Counts the issues support waits for the reporter on.
- * @param issues The reporter's issues.
- * @returns How many issues support waits for the reporter on.
- */
-export function waitingCount(issues: ReportedIssue[]): number {
-    return issues.filter(issue => issue.waitingOnReporter).length;
-}
-
-/**
- * Gets the issues to list.
- * @param issues The reporter's issues, most recent activity first.
- * @param showClosed Whether to list closed issues too.
- * @returns The issues to list, in the order given.
- */
-export function visibleIssues(issues: ReportedIssue[], showClosed: boolean): ReportedIssue[] {
-    return showClosed ? issues : issues.filter(issue => !isClosed(issue.state));
-}
-
-/**
- * Checks whether a release has the fix for an issue.
- * @param issue The issue.
- * @returns True when a release has the fix.
- */
-export function isFixReleased(issue: { fixedInVersion: string }): boolean {
-    return typeof issue.fixedInVersion === 'string' && issue.fixedInVersion.length > 0;
-}

package/Issues/accessStatus.ts

@@ -1,68 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { AccessState, IssueAccess } from '@cratis/showrunner.usher';
-
-/**
- * Whether support may sign in as the reporter on an issue, as the access panel shows it.
- */
-export enum AccessStatus {
-    /** Support may not sign in, and does not ask to. */
-    notGranted = 'notGranted',
-
-    /** Support asks to sign in. */
-    requested = 'requested',
-
-    /** Support may sign in until the grant ends. */
-    granted = 'granted'
-}
-
-/**
- * Decides whether support may sign in as the reporter, against the clock: a grant that has passed its end is over,
- * even before the backend records that it lapsed.
- * @param access The {@link IssueAccess}; nothing when the issue has none yet.
- * @param now What time it is.
- * @returns The {@link AccessStatus}.
- */
-export function accessStatusOf(access: IssueAccess | undefined, now: Date): AccessStatus {
-    if (!access) {
-        return AccessStatus.notGranted;
-    }
-
-    const validUntil = access.validUntil instanceof Date ? access.validUntil : new Date(access.validUntil);
-    if (access.state === AccessState.granted && validUntil.getTime() > now.getTime()) {
-        return AccessStatus.granted;
-    }
-
-    return access.request?.pending ? AccessStatus.requested : AccessStatus.notGranted;
-}
-
-/**
- * The longest the access panel waits before it decides the status again, so it stays right even when the clock jumps.
- */
-export const AccessStatusRefreshInterval = 60_000;
-
-/**
- * Gets how long until the status changes by itself: a live grant ends at its end. Nothing else changes the status
- * without a new fact from the backend.
- * @param access The {@link IssueAccess}; nothing when the issue has none yet.
- * @param now What time it is.
- * @returns How many milliseconds until the status is decided again, at most {@link AccessStatusRefreshInterval}.
- */
-export function nextAccessStatusCheckIn(access: IssueAccess | undefined, now: Date): number {
-    if (accessStatusOf(access, now) !== AccessStatus.granted) {
-        return AccessStatusRefreshInterval;
-    }
-
-    const validUntil = access!.validUntil instanceof Date ? access!.validUntil : new Date(access!.validUntil);
-    return Math.min(Math.max(validUntil.getTime() - now.getTime(), 0), AccessStatusRefreshInterval);
-}
-
-/**
- * Checks whether a support session is still running.
- * @param session The session.
- * @returns True while it runs.
- */
-export function isSessionRunning(session: { ended: boolean }): boolean {
-    return !session.ended;
-}

package/Issues/conversationMessages.ts

@@ -1,136 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { ChatAuthor, ChatAuthorKind, ChatIdentifier, ChatMessage } from '@cratis/components/Chat';
-import { Guid } from '@cratis/fundamentals';
-import { ConversationAuthorKind, ConversationEntry, ConversationEntryKind } from '@cratis/showrunner.usher';
-import { ConversationEventLabels, format, UsherLabels } from '../Labels/index.js';
-
-/**
- * A message in the conversation on an issue, as the chat shows it.
- */
-export interface ConversationMessage extends ChatMessage {
-    /** What the entry records. */
-    readonly kind: ConversationEntryKind;
-
-    /** The question a question or an answer is about; empty for other entries. */
-    readonly questionId: Guid;
-}
-
-const textKinds = new Set<ConversationEntryKind>([
-    ConversationEntryKind.errorReported,
-    ConversationEntryKind.issueDescribed,
-    ConversationEntryKind.detailsAdded,
-    ConversationEntryKind.questionAsked,
-    ConversationEntryKind.questionAnswered,
-    ConversationEntryKind.replied
-]);
-
-const eventLabelKeys: Partial<Record<ConversationEntryKind, keyof ConversationEventLabels>> = {
-    [ConversationEntryKind.identityShared]: 'identityShared',
-    [ConversationEntryKind.accessGranted]: 'accessGranted',
-    [ConversationEntryKind.accessRevoked]: 'accessRevoked',
-    [ConversationEntryKind.accessLapsed]: 'accessLapsed',
-    [ConversationEntryKind.accessRequested]: 'accessRequested',
-    [ConversationEntryKind.supportSignedIn]: 'supportSignedIn',
-    [ConversationEntryKind.supportSessionEnded]: 'supportSessionEnded',
-    [ConversationEntryKind.triaged]: 'triaged',
-    [ConversationEntryKind.accepted]: 'accepted',
-    [ConversationEntryKind.declinedToFix]: 'declinedToFix',
-    [ConversationEntryKind.workStarted]: 'workStarted',
-    [ConversationEntryKind.resolved]: 'resolved',
-    [ConversationEntryKind.reopened]: 'reopened',
-    [ConversationEntryKind.withdrawn]: 'withdrawn',
-    [ConversationEntryKind.linkedToKnownIssue]: 'linkedToKnownIssue',
-    [ConversationEntryKind.unlinkedFromKnownIssue]: 'unlinkedFromKnownIssue',
-    [ConversationEntryKind.linkedToWorkItem]: 'linkedToWorkItem',
-    [ConversationEntryKind.unlinkedFromWorkItem]: 'unlinkedFromWorkItem',
-    [ConversationEntryKind.fixReleased]: 'fixReleased'
-};
-
-const authorKindNames: Record<ConversationAuthorKind, string> = {
-    [ConversationAuthorKind.reporter]: 'reporter',
-    [ConversationAuthorKind.support]: 'support',
-    [ConversationAuthorKind.agent]: 'agent',
-    [ConversationAuthorKind.system]: 'system'
-};
-
-/**
- * Gets the author id a conversation entry is shown under: who it is from and, for support and agents, their name.
- * @param authorKind Who the entry is from.
- * @param authorName The name of the support person or agent; empty when the desk hides it.
- * @returns The author id.
- */
-export function authorIdFor(authorKind: ConversationAuthorKind, authorName: string): string {
-    const kind = authorKindNames[authorKind] ?? authorKindNames[ConversationAuthorKind.system];
-    return authorKind === ConversationAuthorKind.support || authorKind === ConversationAuthorKind.agent
-        ? `${kind}:${authorName ?? ''}`
-        : kind;
-}
-
-/**
- * Resolves an author id of the conversation to who the chat shows.
- * @param authorId The author id, as {@link authorIdFor} gives it.
- * @param labels The labels to show.
- * @returns The {@link ChatAuthor}.
- */
-export function authorOf(authorId: ChatIdentifier, labels: UsherLabels): ChatAuthor {
-    const id = authorId.toString();
-    const separator = id.indexOf(':');
-    const kind = separator >= 0 ? id.substring(0, separator) : id;
-    const name = separator >= 0 ? id.substring(separator + 1) : '';
-
-    switch (kind) {
-        case 'reporter':
-            return { name: labels.conversation.you, kind: ChatAuthorKind.User };
-        case 'support':
-            return { name: name.length > 0 ? name : labels.conversation.support, kind: ChatAuthorKind.User };
-        case 'agent':
-            return { name: name.length > 0 ? name : labels.conversation.support, kind: ChatAuthorKind.Agent };
-        default:
-            return { name: labels.conversation.update, kind: ChatAuthorKind.Agent };
-    }
-}
-
-/**
- * Gets what the chat shows for an entry: its text for what someone wrote, and a sentence for what happened.
- * @param entry The {@link ConversationEntry}.
- * @param labels The labels to show.
- * @returns The body of the message.
- */
-export function bodyOf(entry: ConversationEntry, labels: UsherLabels): string {
-    if (textKinds.has(entry.kind)) {
-        return entry.text;
-    }
-
-    const key = eventLabelKeys[entry.kind];
-    return key ? format(labels.conversation.events[key], { text: entry.text ?? '' }) : entry.text;
-}
-
-/**
- * Converts the entries of the conversation on an issue to the messages the chat shows.
- * @param issueId The issue.
- * @param entries The entries, oldest first.
- * @param labels The labels to show.
- * @returns The {@link ConversationMessage} for every entry, oldest first.
- */
-export function conversationMessages(issueId: Guid, entries: ConversationEntry[], labels: UsherLabels): ConversationMessage[] {
-    return entries.map(entry => ({
-        id: `${entry.entryId}`,
-        topicId: issueId,
-        authorId: authorIdFor(entry.authorKind, entry.authorName),
-        body: bodyOf(entry, labels),
-        timestamp: entry.at instanceof Date ? entry.at : new Date(entry.at),
-        kind: entry.kind,
-        questionId: entry.questionId ?? Guid.empty
-    }));
-}
-
-/**
- * Checks whether a question is open: there is one, and the reporter has not answered it.
- * @param questionId The question; empty when there is none.
- * @returns True when there is a question to answer.
- */
-export function isOpenQuestion(questionId: Guid | undefined): questionId is Guid {
-    return questionId !== undefined && !Guid.empty.equals(questionId);
-}

package/Issues/index.ts

@@ -1,12 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-export * from './accessStatus.js';
-export * from './conversationMessages.js';
-export * from './issueStates.js';
-export * from './IssueView/index.js';
-export * from './MyIssues/index.js';
-export * from './MyIssuesList.js';
-export * from './webAddress.js';
-export * from './useAccessStatus.js';
-export * from './sessionActivity.js';

package/Issues/issueStates.ts

@@ -1,69 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { TagSeverity } from '@cratis/components/Display';
-import { IssueState } from '@cratis/showrunner.usher';
-import { UsherLabels } from '../Labels/index.js';
-
-/**
- * How the state of an issue is shown.
- */
-export interface StateBadge {
-    /** The text. */
-    readonly label: string;
-
-    /** The severity of the tag that shows it. */
-    readonly severity: TagSeverity;
-}
-
-/**
- * Gets how the state of an issue is shown.
- * @param state The {@link IssueState}.
- * @param labels The labels to show.
- * @returns The {@link StateBadge}.
- */
-export function stateBadgeFor(state: IssueState, labels: UsherLabels): StateBadge {
-    switch (state) {
-        case IssueState.reported:
-            return { label: labels.states.reported, severity: 'secondary' };
-        case IssueState.triaged:
-            return { label: labels.states.triaged, severity: 'info' };
-        case IssueState.accepted:
-            return { label: labels.states.accepted, severity: 'info' };
-        case IssueState.inProgress:
-            return { label: labels.states.inProgress, severity: 'warn' };
-        case IssueState.resolved:
-            return { label: labels.states.resolved, severity: 'success' };
-        case IssueState.wontFix:
-            return { label: labels.states.wontFix, severity: 'contrast' };
-        case IssueState.withdrawn:
-            return { label: labels.states.withdrawn, severity: 'secondary' };
-        default:
-            return { label: labels.states.reported, severity: 'secondary' };
-    }
-}
-
-/**
- * Checks whether an issue is closed: resolved, won't fix or withdrawn.
- * @param state The {@link IssueState}.
- * @returns True when closed.
- */
-export function isClosed(state: IssueState): boolean {
-    return state === IssueState.resolved || state === IssueState.wontFix || state === IssueState.withdrawn;
-}
-
-/**
- * The steps of the status strip of an issue, in order.
- */
-export const statusSteps: IssueState[] = [IssueState.reported, IssueState.triaged, IssueState.accepted, IssueState.inProgress, IssueState.resolved];
-
-/**
- * Gets how far along the status strip an issue is.
- * @param state The {@link IssueState}.
- * @returns The index of the step reached; the last step for an issue support will not fix or the reporter
- * withdrew, as nothing more happens on it.
- */
-export function statusStepOf(state: IssueState): number {
-    const index = statusSteps.indexOf(state);
-    return index >= 0 ? index : statusSteps.length - 1;
-}

package/Issues/sessionActivity.ts

@@ -1,43 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { ConversationEntry, ConversationEntryKind, SupportSession } from '@cratis/showrunner.usher';
-import { format, SessionActionLabels } from '../Labels/index.js';
-
-const actionLabelKeys: Partial<Record<ConversationEntryKind, keyof SessionActionLabels>> = {
-    [ConversationEntryKind.detailsAdded]: 'detailsAdded',
-    [ConversationEntryKind.questionAnswered]: 'questionAnswered',
-    [ConversationEntryKind.identityShared]: 'identityShared',
-    [ConversationEntryKind.reopened]: 'reopened',
-    [ConversationEntryKind.withdrawn]: 'withdrawn',
-    [ConversationEntryKind.accessRevoked]: 'accessRevoked'
-};
-
-/**
- * What support did while signed in as the reporter in one session.
- */
-export interface SessionActivity {
-    /** The entry the action is. */
-    readonly entryId: string;
-
-    /** What was done, as the reporter is told. */
-    readonly text: string;
-}
-
-/**
- * Gets what support did as the reporter in a session, oldest first: the entries the backend credits to the session,
- * without the session's own start and end.
- * @param session The {@link SupportSession}.
- * @param entries The entries of the conversation.
- * @param labels The {@link SessionActionLabels}.
- * @returns The {@link SessionActivity} of the session.
- */
-export function sessionActivityOf(session: SupportSession, entries: ConversationEntry[], labels: SessionActionLabels): SessionActivity[] {
-    const sessionId = session.sessionId.toString();
-    return entries
-        .filter(entry => (entry.session ?? '').toString() === sessionId)
-        .flatMap(entry => {
-            const key = actionLabelKeys[entry.kind];
-            return key ? [{ entryId: entry.entryId.toString(), text: format(labels[key], { text: entry.text ?? '' }) }] : [];
-        });
-}

package/Issues/useAccessStatus.ts

@@ -1,24 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { IssueAccess } from '@cratis/showrunner.usher';
-import { useEffect, useState } from 'react';
-import { AccessStatus, accessStatusOf, nextAccessStatusCheckIn } from './accessStatus.js';
-
-/**
- * Decides whether support may sign in as the reporter, and decides again when a grant reaches its end, or at the
- * latest once a minute, so a grant that runs out while the view is open is shown as over
- * without waiting for the backend to record the lapse.
- * @param access The {@link IssueAccess}; nothing when the issue has none yet.
- * @returns The {@link AccessStatus} now, and the time it was decided at.
- */
-export function useAccessStatus(access: IssueAccess | undefined): [AccessStatus, Date] {
-    const [now, setNow] = useState(() => new Date());
-
-    useEffect(() => {
-        const timer = setTimeout(() => setNow(new Date()), nextAccessStatusCheckIn(access, new Date()));
-        return () => clearTimeout(timer);
-    }, [access, now]);
-
-    return [accessStatusOf(access, now), now];
-}

package/Issues/webAddress.ts

@@ -1,22 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-/**
- * Gets whether an address is an absolute `https` or `http` address, the only kind offered to the reporter as a link.
- * Usher already records any other address from a desk as no address; this keeps a link from ever pointing at a
- * `javascript:` or `data:` address should one reach the view some other way.
- * @param address The address.
- * @returns True when it is a web address.
- */
-export function isWebAddress(address: string | undefined): boolean {
-    if (!address) {
-        return false;
-    }
-
-    try {
-        const { protocol } = new URL(address);
-        return protocol === 'https:' || protocol === 'http:';
-    } catch {
-        return false;
-    }
-}