@kubohiroya/turbowarp-plus-editor-git 0.0.0-stage → 0.7.0

package/src/project-source-diff.css

@@ -0,0 +1,79 @@
+.twgit-block-diff {
+    color: CanvasText;
+    background: Canvas;
+    font: 14px/1.5 system-ui, sans-serif;
+    container-type: inline-size;
+}
+.twgit-block-diff h2 { margin: 0; font-size: 1.3em; }
+.twgit-block-diff > p { margin: 4px 0 10px; }
+.twgit-block-diff-card {
+    border: 1px solid color-mix(in srgb, CanvasText 25%, Canvas);
+    border-radius: 8px;
+    margin: 12px 0;
+    overflow: hidden;
+}
+.twgit-block-diff-card > header { padding: 10px 14px; background: color-mix(in srgb, CanvasText 5%, Canvas); }
+.twgit-block-diff-card h3, .twgit-block-diff-card h4 { margin: 0; font-size: 1em; overflow-wrap: anywhere; }
+.twgit-block-diff-card h3 span { margin-inline-end: 6px; color: CanvasText; border-bottom: 3px solid var(--twgit-change); }
+.twgit-block-diff-card p { margin: 4px 0 0; }
+.twgit-block-diff-added { --twgit-change: #25875d; }
+.twgit-block-diff-removed { --twgit-change: #c54a53; }
+.twgit-block-diff-updated { --twgit-change: #635bce; }
+.twgit-block-diff-sides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
+.twgit-block-diff-side { padding: 10px 14px; min-width: 0; }
+.twgit-block-diff-side + .twgit-block-diff-side { border-inline-start: 1px solid color-mix(in srgb, CanvasText 20%, Canvas); }
+.twgit-block-diff-preview { overflow: auto; max-height: 420px; }
+.twgit-block-diff-surface { position: relative; min-width: 100%; height: 64px; }
+/* These markers also apply to the live Editor workspace returned by the host. */
+.twgit-changed-block > .blocklyPath { stroke: var(--twgit-change, #635bce); stroke-width: 2.5px; }
+.twgit-changed-block-part { outline: 2.5px solid #b4510a; outline-offset: 2px; }
+.twgit-block-diff-legend { font-size: .9em; }
+.twgit-block-diff-side > button { margin-top: 8px; }
+.twgit-block-diff-card > label { display: block; padding: 7px 14px 10px; }
+@container (max-width: 440px) {
+    .twgit-block-diff-sides { grid-template-columns: minmax(0, 1fr); }
+    .twgit-block-diff-side + .twgit-block-diff-side { border-inline-start: 0; border-block-start: 1px solid color-mix(in srgb, CanvasText 20%, Canvas); }
+}
+
+.twgit-review { --twgit-review-line: color-mix(in srgb, CanvasText 18%, Canvas); }
+.twgit-review-overview { border-bottom: 1px solid var(--twgit-review-line); padding-bottom: 14px; }
+.twgit-review-overview > p:first-child { margin: 0 0 5px; color: color-mix(in srgb, CanvasText 70%, Canvas); font-weight: 600; }
+.twgit-review-overview h2 { font-size: 1.65em; }
+.twgit-review-description { white-space: pre-wrap; overflow-wrap: anywhere; margin: 5px 0; }
+.twgit-review-body summary { cursor: pointer; text-decoration: underline; }
+.twgit-review-overview dl { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
+.twgit-review-overview dl > div { min-width: 90px; padding: 7px 12px; border: 1px solid var(--twgit-review-line); border-radius: 6px; }
+.twgit-review-overview dt { font-size: .85em; }
+.twgit-review-overview dd { margin: 0; font-size: 1.3em; font-weight: 650; }
+.twgit-review-checklist h3, .twgit-review-checklist ul { margin: 0; }
+.twgit-review-checklist ul { padding-inline-start: 22px; }
+.twgit-review-files-title { margin: 13px 0 6px; }
+.twgit-review-file { border: 1px solid var(--twgit-review-line); border-radius: 8px; overflow: hidden; margin-bottom: 10px; }
+.twgit-review-file > header { background: color-mix(in srgb, CanvasText 5%, Canvas); padding: 8px 12px; }
+.twgit-review-file > header h4, .twgit-review-file > header p { margin: 0; overflow-wrap: anywhere; }
+.twgit-review-file > p, .twgit-review-target > p { margin: 6px 12px; }
+.twgit-review-target { padding: 6px 12px 10px; }
+.twgit-review-target h5 { font-size: 1em; margin: 0 0 5px; }
+.twgit-review-target h5 small { margin-inline-start: 6px; font-weight: 400; }
+.twgit-review-script { border: 1px solid var(--twgit-review-line); border-radius: 6px; margin: 4px 0; overflow: hidden; }
+.twgit-review-script > summary { cursor: pointer; padding: 7px 10px; list-style: none; }
+.twgit-review-script > summary::-webkit-details-marker { display: none; }
+.twgit-review-script > summary::before { content: '▸'; margin-inline-end: 7px; }
+.twgit-review-script[open] > summary::before { content: '▾'; }
+.twgit-review-script > summary:focus-visible { outline: 2px solid Highlight; outline-offset: -2px; }
+.twgit-review-script > summary > * { margin-inline-end: 8px; }
+.twgit-review-script[open] > summary { border-bottom: 1px solid var(--twgit-review-line); }
+.twgit-review-script h4 { margin: 0 0 3px; }
+.twgit-review-script .twgit-block-diff-side + .twgit-block-diff-side { border-inline-start: 0; border-block-start: 1px solid var(--twgit-review-line); }
+.twgit-review-script .twgit-block-diff-sides > div + div { border-inline-start: 1px solid var(--twgit-review-line); }
+.twgit-review-status { font-size: .85em; padding: 2px 5px; border: 1px solid var(--twgit-review-line); border-radius: 4px; }
+.twgit-review-checked { display: block; padding: 6px 12px 9px; }
+@container (max-width: 440px) {
+    .twgit-review-script .twgit-block-diff-sides > div + div { border-inline-start: 0; border-block-start: 1px solid var(--twgit-review-line); }
+}
+
+.twgit-pr-number { display: flex; flex-wrap: wrap; align-items: end; gap: 6px; margin-bottom: 8px; }
+.twgit-pr-number input { display: block; width: 10em; max-width: 100%; }
+.twgit-pr-paging, .twgit-pr-revision { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
+.twgit-pr-revision code { overflow-wrap: anywhere; }
+.twgit-review .twgit-block-diff-side h4 { font-size: 1em; }

package/src/project-source-diff.tsx

@@ -0,0 +1,132 @@
+import React, {useEffect, useMemo, useRef, useState} from 'react';
+import {compareProjectBlocks, readProjectSourceDiff} from './project-source-patch.js';
+import type {BlockChange} from './project-source-patch.js';
+import type {ProjectBlockLocator} from './block-diff-location.js';
+import type {ProjectBlockRenderer} from './scratch-block-diff-renderer.js';
+import {BlockPreview} from './block-diff-preview.js';
+import type {LocationStatus} from './block-diff-preview.js';
+import './project-source-diff.css';
+
+export {createGitHubPullRequests, gitHubRepositoryFromOrigin} from './github-pull-requests.js';
+export {ProjectSourceComparison, ProjectSourceReview} from './project-source-review.js';
+export type {ProjectSourceComparisonProps, ProjectSourceReviewFile, ProjectSourceReviewProps} from './project-source-review.js';
+
+export {createScratchBlocksDiffLocator} from './block-diff-location.js';
+export type {ProjectBlockLocation, ProjectBlockLocator, ScratchBlockLocationWorkspace} from './block-diff-location.js';
+export type {BlockPart} from './project-source-patch.js';
+export {createProjectSourceDiff} from './project-source-patch.js';
+export {createScratchBlocksDiffRenderer} from './scratch-block-diff-renderer.js';
+export type {ProjectBlockRenderer, ScratchBlockDiffRendererOptions, ScratchBlocksPort} from './scratch-block-diff-renderer.js';
+
+const en = {
+    title: 'Block changes', before: 'Before', after: 'After', added: 'Added', removed: 'Removed', updated: 'Changed',
+    inputs: 'Inputs', fields: 'Fields', opcode: 'Block type', mutation: 'Block shape', position: 'Position',
+    connection: 'Connections', properties: 'Other block properties',
+    absent: 'No block on this side', omitted: (count: number) => `${count} unchanged blocks omitted from the change list`,
+    context: 'Highlight in the surrounding script', more: 'Show more changes', noChanges: 'No block changes.',
+    locate: 'Highlight in Editor', locating: 'Finding the block in the Editor…', located: 'Highlighted in the Editor.',
+    missingLocation: 'This version or block is unavailable in the Editor. Open its surrounding script here.',
+    partLegend: 'Orange outlines mark changed inputs and fields.',
+    otherChanges: 'The project also has changes outside its block code.',
+    invalid: 'This diff could not be read. Use a full-context project diff, or provide the original project.',
+    loading: 'Rendering blocks…', unavailable: 'This block could not be rendered. Check the block definitions available in the host.'
+};
+const ja: typeof en = {
+    title: 'ブロックの変更', before: '変更前', after: '変更後', added: '追加', removed: '削除', updated: '変更',
+    inputs: '入力値', fields: 'フィールド', opcode: 'ブロックの種類', mutation: 'ブロックの形', position: '位置',
+    connection: 'つなぎ方', properties: 'その他のブロック属性',
+    absent: 'この側にはブロックがありません', omitted: count => `変更のないブロック ${count} 個を一覧から省略`,
+    context: '元のスクリプト内で強調', more: '続きを表示', noChanges: 'ブロックの変更はありません。',
+    locate: '編集画面で強調', locating: '編集画面でブロックを検索中…', located: '編集画面で強調しました。',
+    missingLocation: '編集画面に該当する版またはブロックがありません。元のスクリプトをここで展開できます。',
+    partLegend: 'オレンジの枠は、変更された入力欄やフィールドです。',
+    otherChanges: 'ブロックのコード以外にも作品の変更があります。',
+    invalid: '差分を読み込めません。全体の文脈を含む差分を使うか、変更前の作品を指定してください。',
+    loading: 'ブロックを描画中…', unavailable: 'ブロックを描画できません。ホストのブロック定義を確認してください。'
+};
+
+export interface ProjectSourceBlockDiffProps {
+    patch: string;
+    /** Supply the original JSON if the unified patch omits context. */
+    beforeSource?: string;
+    renderBlock: ProjectBlockRenderer;
+    locateBlock?: ProjectBlockLocator;
+    locale?: string;
+}
+
+type Version = 'before' | 'after';
+
+const propertyLabels = new Map<string, keyof typeof en>([
+    ['inputs', 'inputs'], ['fields', 'fields'], ['opcode', 'opcode'], ['mutation', 'mutation'],
+    ['x', 'position'], ['y', 'position'], ['next', 'connection'], ['parent', 'connection'], ['topLevel', 'connection']
+]);
+
+function ChangeCard({change, renderBlock, labels, onLocate, location}: {
+    change: BlockChange; renderBlock: ProjectBlockRenderer; labels: typeof en;
+    onLocate?: (version: Version) => void; location?: {version: Version; status: LocationStatus};
+}) {
+    const [withContext, setWithContext] = useState(false);
+    const notes = [...new Set(change.fields.map(field => labels[propertyLabels.get(field) ?? 'properties']))];
+    const name = (change.after ?? change.before)!.target.name;
+    return <article className={`twgit-block-diff-card twgit-block-diff-${change.kind}`}>
+        <header>
+            <h3><span>{labels[change.kind]}</span> {name}</h3>
+            {!!notes.length && <p>{notes.join(' · ')}</p>}
+            {!!change.parts.length && <p className="twgit-block-diff-legend">{labels.partLegend}</p>}
+        </header>
+        <div className="twgit-block-diff-sides">
+            {(['before', 'after'] as const).map(version => <BlockPreview key={version} side={change[version]} title={labels[version]}
+                renderBlock={renderBlock} withContext={withContext} labels={labels} parts={change.parts}
+                onLocate={onLocate && (() => onLocate(version))}
+                locationStatus={location?.version === version ? location.status : undefined}/>)}
+        </div>
+        <label><input type="checkbox" checked={withContext} onChange={event => setWithContext(event.currentTarget.checked)}/> {labels.context}</label>
+    </article>;
+}
+
+const pageSize = 12;
+const empty = {changes: [], unchanged: 0, otherChanges: false};
+
+export function ProjectSourceBlockDiff({patch, beforeSource, renderBlock, locateBlock, locale = 'en'}: ProjectSourceBlockDiffProps) {
+    const labels = locale.startsWith('ja') ? ja : en;
+    const result = useMemo(() => {
+        try {
+            const projects = readProjectSourceDiff(patch, beforeSource);
+            return projects ? compareProjectBlocks(...projects) : empty;
+        } catch {
+            return null;
+        }
+    }, [patch, beforeSource]);
+    const [page, setPage] = useState({result, visible: pageSize});
+    const request = useRef<AbortController>();
+    const [location, setLocation] = useState<{result: typeof result; key: string; version: Version; locator: ProjectBlockLocator; status: LocationStatus}>();
+    useEffect(() => () => request.current?.abort(), [result, locateBlock]);
+    const locate = async (change: BlockChange, version: Version) => {
+        const side = change[version];
+        if (!side || !locateBlock) return;
+        request.current?.abort();
+        const controller = new AbortController();
+        request.current = controller;
+        const selected = {result, key: change.key, version, locator: locateBlock};
+        setLocation({...selected, status: 'locating'});
+        let found = false;
+        try {
+            found = await locateBlock({...side, version, parts: change.parts, signal: controller.signal});
+        } catch {
+            // The host may replace the active project while resolving its workspace.
+        }
+        if (!controller.signal.aborted) setLocation({...selected, status: found ? 'located' : 'missingLocation'});
+    };
+    if (!result) return <p role="alert">{labels.invalid}</p>;
+    const visible = page.result === result ? page.visible : pageSize;
+    return <section className="twgit-block-diff" aria-label={labels.title}>
+        <h2>{labels.title} · {result.changes.length}</h2>
+        {result.unchanged > 0 && <p>{labels.omitted(result.unchanged)}</p>}
+        {result.otherChanges && <p>{labels.otherChanges}</p>}
+        {!result.changes.length && <p>{labels.noChanges}</p>}
+        {result.changes.slice(0, visible).map(change => <ChangeCard key={change.key} change={change} renderBlock={renderBlock} labels={labels}
+            onLocate={locateBlock && (version => void locate(change, version))}
+            location={location?.result === result && location.locator === locateBlock && location.key === change.key ? location : undefined}/>)}
+        {visible < result.changes.length && <button type="button" onClick={() => setPage({result, visible: visible + pageSize})}>{labels.more}</button>}
+    </section>;
+}

package/src/project-source-patch.ts

@@ -0,0 +1,126 @@
+import {applyPatch, createTwoFilesPatch, parsePatch} from 'diff';
+
+export type BlockTable = Record<string, unknown>;
+export interface ProjectTarget {
+    name: string;
+    isStage: boolean;
+    blocks: BlockTable;
+}
+export type ProjectSource = Record<string, unknown> & {targets: ProjectTarget[]};
+
+export const isRecord = (value: unknown): value is Record<string, unknown> =>
+    typeof value === 'object' && value !== null && !Array.isArray(value);
+
+function readProject(source: string): ProjectSource {
+    const project: unknown = JSON.parse(source);
+    if (!isRecord(project) || !Array.isArray(project.targets) || !project.targets.every(target =>
+        isRecord(target) && typeof target.name === 'string' && typeof target.isStage === 'boolean' && (target.blocks === undefined || isRecord(target.blocks)))) {
+        throw new Error('Expected a project.source.json with Scratch targets and blocks.');
+    }
+    const parsed = project as ProjectSource;
+    return {...parsed, targets: parsed.targets.map(target => ({...target, blocks: target.blocks ?? {}}))};
+}
+
+/** Reads one version of a project.source.json. `null` stands for a version in which the file does not exist. */
+export function parseProjectSource(source: string | null): ProjectSource {
+    return source === null ? {targets: []} : readProject(source);
+}
+
+/** Keep the original lines and include enough context to render both sides from the patch alone. */
+export function createProjectSourceDiff(before: string, after: string): string {
+    readProject(before);
+    readProject(after);
+    const patch = createTwoFilesPatch('a/project.source.json', 'b/project.source.json', before, after,
+        undefined, undefined, {context: Infinity, timeout: 1000});
+    if (patch === undefined) throw new Error('Project source diff exceeded its time limit.');
+    return 'diff --git a/project.source.json b/project.source.json\n' + patch.replace(/^=+\n/, '');
+}
+
+export function readProjectSourceDiff(patch: string, beforeSource?: string): [ProjectSource, ProjectSource] | null {
+    const [file, extra] = parsePatch(patch);
+    if (!file || extra || !file.oldFileName || !file.newFileName) throw new Error('Expected a single unified text diff.');
+    if (beforeSource !== undefined) {
+        const before = readProject(beforeSource);
+        const after = applyPatch(beforeSource, file);
+        if (after === false) throw new Error('The original project does not match this diff.');
+        return [before, readProject(after)];
+    }
+    if (!file.hunks.length) return null;
+    const before: string[] = [], after: string[] = [];
+    for (const hunk of file.hunks) {
+        if (hunk.oldStart !== before.length + 1 || hunk.newStart !== after.length + 1) {
+            throw new Error('The diff omits project context.');
+        }
+        for (const line of hunk.lines) {
+            if (line.startsWith(' ') || line.startsWith('-')) before.push(line.slice(1));
+            if (line.startsWith(' ') || line.startsWith('+')) after.push(line.slice(1));
+        }
+    }
+    return [readProject(before.join('\n')), readProject(after.join('\n'))];
+}
+
+export function equal(a: unknown, b: unknown): boolean {
+    if (a === b) return true;
+    if (Array.isArray(a) && Array.isArray(b)) return a.length === b.length && a.every((value, i) => equal(value, b[i]));
+    if (!isRecord(a) || !isRecord(b)) return false;
+    const keys = Object.keys(a);
+    return keys.length === Object.keys(b).length && keys.every(key => Object.hasOwn(b, key) && equal(a[key], b[key]));
+}
+
+export const targetKey = (target: ProjectTarget) => target.isStage ? 'stage' : 'sprite:' + target.name;
+
+export interface BlockSide { target: ProjectTarget; id: string }
+export interface BlockPart { kind: 'input' | 'field'; name: string }
+
+function changedParts(before: unknown, after: unknown): BlockPart[] {
+    if (!isRecord(before) || !isRecord(after)) return [];
+    const result: BlockPart[] = [];
+    // A shadow hidden behind a reporter is not the field shown in the workspace.
+    const visibleInput = (input: unknown) => Array.isArray(input) ? input[1] ?? input[2] : input;
+    for (const group of ['inputs', 'fields'] as const) {
+        const oldGroup = isRecord(before[group]) ? before[group] : {};
+        const newGroup = isRecord(after[group]) ? after[group] : {};
+        for (const name of new Set([...Object.keys(oldGroup), ...Object.keys(newGroup)])) {
+            const a = oldGroup[name], b = newGroup[name];
+            if (group === 'inputs' ? !equal(visibleInput(a), visibleInput(b)) : !equal(a, b)) {
+                result.push({kind: group === 'inputs' ? 'input' : 'field', name});
+            }
+        }
+    }
+    return result;
+}
+export type BlockChangeKind = 'added' | 'removed' | 'updated';
+export interface BlockChange {
+    key: string;
+    before?: BlockSide;
+    after?: BlockSide;
+    kind: BlockChangeKind;
+    fields: string[];
+    parts: BlockPart[];
+}
+
+export function compareProjectBlocks(before: ProjectSource, after: ProjectSource) {
+    const oldTargets = new Map(before.targets.map(target => [targetKey(target), target]));
+    const newTargets = new Map(after.targets.map(target => [targetKey(target), target]));
+    const changes: BlockChange[] = [];
+    let unchanged = 0;
+    for (const key of new Set([...oldTargets.keys(), ...newTargets.keys()])) {
+        const oldTarget = oldTargets.get(key), newTarget = newTargets.get(key);
+        const oldBlocks: BlockTable = oldTarget?.blocks ?? {}, newBlocks: BlockTable = newTarget?.blocks ?? {};
+        for (const id of new Set([...Object.keys(oldBlocks), ...Object.keys(newBlocks)])) {
+            const hadBlock = Object.hasOwn(oldBlocks, id), hasBlock = Object.hasOwn(newBlocks, id);
+            const a = oldBlocks[id], b = newBlocks[id];
+            if (hadBlock && hasBlock && equal(a, b)) {
+                unchanged++;
+                continue;
+            }
+            const fields = isRecord(a) && isRecord(b) ?
+                [...new Set([...Object.keys(a), ...Object.keys(b)])].filter(field => !equal(a[field], b[field])) : [];
+            changes.push({key: JSON.stringify([key, id]), before: hadBlock && oldTarget ? {target: oldTarget, id} : undefined,
+                after: hasBlock && newTarget ? {target: newTarget, id} : undefined,
+                kind: !hadBlock ? 'added' : !hasBlock ? 'removed' : 'updated', fields, parts: changedParts(a, b)});
+        }
+    }
+    const withoutBlocks = (project: ProjectSource) => ({...project, targets: project.targets.map(({blocks: _, ...target}) => target)});
+    return {changes, unchanged, otherChanges: !equal(withoutBlocks(before), withoutBlocks(after))};
+}

package/src/project-source-review-model.ts

@@ -0,0 +1,113 @@
+import {compareProjectBlocks, equal, isRecord, targetKey} from './project-source-patch.js';
+import type {BlockChange, BlockSide, ProjectSource, ProjectTarget} from './project-source-patch.js';
+import type {ScriptBlockMark} from './scratch-block-diff-renderer.js';
+
+export interface ScriptReviewSide extends BlockSide { marks: ScriptBlockMark[] }
+export interface ScriptReview {
+    id: string;
+    before: ScriptReviewSide[];
+    after: ScriptReviewSide[];
+}
+export interface TargetReview {
+    name: string;
+    isStage: boolean;
+    scripts: ScriptReview[];
+    properties: string[];
+}
+
+function scriptRoots(target?: ProjectTarget) {
+    const roots = new Map<string, string>();
+    if (!target) return roots;
+    for (const id of Object.keys(target.blocks)) {
+        if (roots.has(id)) continue;
+        const chain = new Set<string>();
+        let current = id;
+        while (!roots.has(current) && !chain.has(current)) {
+            chain.add(current);
+            const block = target.blocks[current];
+            if (!isRecord(block) || typeof block.parent !== 'string' || !Object.hasOwn(target.blocks, block.parent)) break;
+            current = block.parent;
+        }
+        const root = roots.get(current) ?? current;
+        for (const block of chain) roots.set(block, root);
+    }
+    return roots;
+}
+
+function groupScripts(before: ProjectTarget | undefined, after: ProjectTarget | undefined, changes: readonly BlockChange[]) {
+    const roots = {before: scriptRoots(before), after: scriptRoots(after)};
+    const parents = new Map<string, string>();
+    function groupOf(key: string) {
+        let parent = key;
+        while (parents.has(parent)) parent = parents.get(parent)!;
+        for (let current = key; current !== parent;) {
+            const next = parents.get(current)!;
+            parents.set(current, parent);
+            current = next;
+        }
+        return parent;
+    }
+
+    // Blocks retained across versions connect their original and new scripts, including splits and merges.
+    for (const [id, oldRoot] of roots.before) {
+        const newRoot = roots.after.get(id);
+        if (newRoot === undefined) continue;
+        const a = groupOf('before:' + oldRoot), b = groupOf('after:' + newRoot);
+        if (a !== b) parents.set(b, a);
+    }
+    const groups = new Map<string, ScriptReview>();
+    const sides = new Map<string, ScriptReviewSide>();
+    for (const version of ['before', 'after'] as const) {
+        const target = version === 'before' ? before : after;
+        if (!target) continue;
+        for (const root of new Set(roots[version].values())) {
+            const key = version + ':' + root;
+            const id = groupOf(key);
+            const group = groups.get(id) ?? {id, before: [], after: []};
+            const side: ScriptReviewSide = {target, id: root, marks: []};
+            group[version].push(side);
+            groups.set(id, group);
+            sides.set(key, side);
+        }
+    }
+    const affected = new Set<string>();
+    for (const change of changes) {
+        for (const version of ['before', 'after'] as const) {
+            const block = change[version];
+            if (!block) continue;
+            const key = version + ':' + roots[version].get(block.id);
+            sides.get(key)?.marks.push({id: block.id, kind: change.kind, parts: change.parts});
+            affected.add(groupOf(key));
+        }
+    }
+    return [...affected].map(id => groups.get(id)!);
+}
+
+function changedProperties(before: Record<string, unknown>, after: Record<string, unknown>, except: string) {
+    return [...new Set([...Object.keys(before), ...Object.keys(after)])].filter(key => key !== except && !equal(before[key], after[key]));
+}
+
+export function compareProjectForReview(before: ProjectSource, after: ProjectSource) {
+    const {changes} = compareProjectBlocks(before, after);
+    const byTarget = new Map<string, BlockChange[]>();
+    for (const change of changes) {
+        const key = targetKey((change.after ?? change.before)!.target);
+        const existing = byTarget.get(key);
+        if (existing) existing.push(change);
+        else byTarget.set(key, [change]);
+    }
+    const oldTargets = new Map(before.targets.map(target => [targetKey(target), target]));
+    const newTargets = new Map(after.targets.map(target => [targetKey(target), target]));
+    const targets: TargetReview[] = [];
+    for (const key of new Set([...oldTargets.keys(), ...newTargets.keys()])) {
+        const a = oldTargets.get(key), b = newTargets.get(key);
+        const edits = byTarget.get(key);
+        const scripts = edits ? groupScripts(a, b, edits) : [];
+        const properties = changedProperties({...a}, {...b}, 'blocks');
+        if (scripts.length || properties.length) {
+            const {name, isStage} = (b ?? a)!;
+            targets.push({name, isStage, scripts, properties});
+        }
+    }
+    return {targets, properties: changedProperties(before, after, 'targets')};
+}