(() => {
+ const result = {} as ExitScreenContentByReason;
+ for (const key of Object.keys(configs) as ExitReasonType[]) {
+ if (key === "denied") {
+ const cfg = isSignedIn ? configs.denied : deniedAnonymousConfig;
+ result[key] = {
+ title: cfg.title,
+ message: cfg.message,
+ buttonLabel: cfg.buttonLabel,
+ buttonUrl: cfg.buttonUrl || undefined,
+ };
+ } else {
+ const cfg = configs[key];
+ result[key] = {
+ title: cfg.title,
+ message: cfg.message,
+ buttonLabel: cfg.buttonLabel,
+ buttonUrl: cfg.buttonUrl || undefined,
+ };
+ }
+ }
+ return result;
+ }, [configs, deniedAnonymousConfig, isSignedIn]);
+
+ const renderFieldGroup = (
+ label: string,
+ config: ReasonConfig,
+ onChange: (field: keyof ReasonConfig, value: string) => void,
+ isActive: boolean,
+ onSelect?: () => void,
+ ) => {
+ const interactiveProps = onSelect
+ ? {
+ onClick: onSelect,
+ onKeyDown: (e: React.KeyboardEvent) => {
+ if (e.currentTarget !== e.target) {
+ return;
+ }
+ if (e.key === "Enter" || e.key === " ") {
+ e.preventDefault();
+ onSelect();
+ }
+ },
+ role: "button" as const,
+ tabIndex: 0,
+ }
+ : {};
+
+ return (
+
+
+ {label}
+ {isActive && ACTIVE}
+
+
+