::selection {

  background: var(--color-fill-yellow);

  color: var(--color-foreground-black);

}

.global-syntax.operator,

.global-syntax.keyword\.repeat,

.global-syntax.keyword {

.global-syntax.type {

.global-syntax.property,

.global-syntax.variable\.parameter {

.global-syntax.punctuation\.delimiter {

.global-syntax.punctuation\.bracket {

.global-syntax.attribute {

.global-syntax.number,

.global-syntax.constant,

.global-syntax.type\.builtin,

.global-syntax.constant\.builtin,

.global-syntax.variable\.builtin,

.global-syntax.function {

.global-syntax.comment,

.global-syntax.comment\.documentation {

.global-syntax.string {

.global-syntax.string.special {

.global-syntax.function\.method {

.global-syntax.type.builtin {

.global-syntax.punctuation.bracket {

.global-syntax.punctuation.delimiter {

.global-syntax.punctuation.special {

.global-syntax.text.literal {

.global-syntax.text.title {

.global-syntax.variable {

.global-syntax.attribute {

.global-syntax.label {

.global-syntax.type {

.global-syntax.variable.parameter {

.global-syntax.constructor {

.global-syntax.tag\.delimiter {

    onclick?: (e: MouseEvent) => void;

  import type { CodeLocation } from "@bindings/cob/thread/CodeLocation";

  import type { Embed } from "@bindings/cob/thread/Embed";

  import type { Thread } from "@bindings/cob/thread/Thread";

    createComment?: (

      body: string,

      embeds: Embed[],

      replyTo?: string,

      location?: CodeLocation,

    ) => Promise<void>;

    codeCommentThreads?: Thread<CodeLocation>[];

  let {

    createComment,

    codeCommentThreads,

    patchId,

    revision,

    rid,

    showCommits = true,

  }: Props = $props();

        unified: 3,

    <Changeset

      {codeCommentThreads}

      {diff}

      {rid}

      expanded={filesExpanded}

      {createComment}

      head={revision.head} />

  import type { CodeLocation } from "@bindings/cob/thread/CodeLocation";

  import type { Embed } from "@bindings/cob/thread/Embed";

  import type { Thread } from "@bindings/cob/thread/Thread";

  import FileDiff from "./FileDiff.svelte";

    rid: string;

    head: string;

    codeCommentThreads?: Thread<CodeLocation>[];

    createComment?: (

      body: string,

      embeds: Embed[],

      replyTo?: string,

      location?: CodeLocation,

    ) => Promise<void>;

  const {

    diff,

    expanded = true,

    rid,

    createComment,

    head,

    codeCommentThreads,

  }: Props = $props();

        {file}

        {rid}

        {createComment}

        {head}

        {codeCommentThreads} />

    font-family: var(--font-family-sans-serif);

    onclick={e => {

      e.preventDefault();

      e.stopPropagation();

<script lang="ts">

  type Side = "left" | "right";

  type SelectionAnchor = { side: Side; lineNumber: number };

  interface Selection {

    file: string;

    start: SelectionAnchor;

    end: SelectionAnchor;

    startHunkIdx: number;

    endHunkIdx: number;

    startLineIdx: number;

    endLineIdx: number;

  }

  import type { CodeLocation } from "@bindings/cob/thread/CodeLocation";

  import type { Embed } from "@bindings/cob/thread/Embed";

  import type { FileDiff } from "@bindings/diff/FileDiff";

  import type { Modification } from "@bindings/diff/Modification";

  import type { Thread } from "@bindings/cob/thread/Thread";

  import escape from "lodash/escape";

  import CommentToggleInput from "./CommentToggleInput.svelte";

  interface Props {

    file: FileDiff;

    rid: string;

    head: string;

    createComment?: (

      body: string,

      embeds: Embed[],

      replyTo?: string,

      location?: CodeLocation,

    ) => Promise<void>;

    codeCommentThreads?: Thread<CodeLocation>[];

  }

  const { file, rid, createComment, head, codeCommentThreads }: Props =

    $props();

  console.log({ codeCommentThreads });

  let dragging = $state(false);

  let selection: Selection | undefined = $state(undefined);

  function lineNumber(line: Modification, side: Side): number | undefined {

    if (side === "left") {

      if (line.type === "context") {

        return line.lineNoOld;

      }

      if (line.type === "deletion") {

        return line.lineNo;

      }

    } else {

      if (line.type === "context") {

        return line.lineNoNew;

      }

      if (line.type === "addition") {

        return line.lineNo;

      }

    }

  }

  function determineSelectedAnchor(

    side: Side,

    line: Modification,

  ): SelectionAnchor {

    // When a user tries to select a side with no changes, use opposite side.

    if (side === "left" && line.type === "addition") {

      return { side: "right", lineNumber: line.lineNo };

    } else if (side === "right" && line.type === "deletion") {

      return { side: "left", lineNumber: line.lineNo };

    } else {

      return side === "left"

        ? { side: "left", lineNumber: lineNumber(line, "left") as number } // FIXME get rid of type assertion

        : { side: "right", lineNumber: lineNumber(line, "right") as number }; //FIXME get rid of type assertion

    }

  }

  function deselect() {

    selection = undefined;

  }

  function filePath(file: FileDiff, side: Side): string {

    if (file.status === "moved" || file.status === "copied") {

      if (side === "left") {

        return file.oldPath;

      } else {

        return file.newPath;

      }

    } else {

      return file.path;

    }

  }

  function endDragSelection() {

    dragging = false;

  }

  function startDragSelection(

    e: MouseEvent,

    file: FileDiff,

    side: Side,

    line: Modification,

    hunkIdx: number,

    lineIdx: number,

  ) {

    e.preventDefault();

    e.stopPropagation();

    dragging = true;

    selection = {

      file: filePath(file, side),

      start: determineSelectedAnchor(side, line),

      end: determineSelectedAnchor(side, line),

      startHunkIdx: hunkIdx,

      endHunkIdx: hunkIdx,

      startLineIdx: lineIdx,

      endLineIdx: lineIdx,

    };

  }

  function endShiftSelection(

    e: MouseEvent,

    file: FileDiff,

    side: Side,

    line: Modification,

    hunkIdx: number,

    lineIdx: number,

  ) {

    e.preventDefault();

    e.stopPropagation();

    if (

      selection &&

      // Prevent inter-hunk selection.

      hunkIdx === selection.startHunkIdx &&

      // Prevent reverse selection (i.e. end marker before start marker).

      lineIdx >= selection.startLineIdx

    ) {

      // Prevent setting the end marker before the start marker

      // on the same line.

      if (

        selection.startLineIdx === lineIdx &&

        selection.start.side === "right" &&

        side === "left"

      ) {

        return;

      }

      selection = {

        file: filePath(file, side),

        start: selection.start,

        end: determineSelectedAnchor(side, line),

        startHunkIdx: selection.startHunkIdx,

        endHunkIdx: hunkIdx,

        startLineIdx: selection.startLineIdx,

        endLineIdx: lineIdx,

      };

    }

  }

  function addToDragSelection(

    file: FileDiff,

    side: Side,

    line: Modification,

    hunkIdx: number,

    lineIdx: number,

  ) {

    if (

      dragging &&

      selection &&

      // Prevent inter-hunk selection.

      hunkIdx === selection.startHunkIdx &&

      // Prevent reverse selection (i.e. end marker before start marker).

      lineIdx >= selection.startLineIdx

    ) {

      // Prevent setting the end marker before the start marker

      // on the same line.

      if (

        selection.startLineIdx === lineIdx &&

        selection.start.side === "right" &&

        side === "left"

      ) {

        return;

      }

      selection = {

        file: filePath(file, side),

        start: selection.start,

        end: determineSelectedAnchor(side, line),

        startHunkIdx: selection.startHunkIdx,

        endHunkIdx: hunkIdx,

        startLineIdx: selection.startLineIdx,

        endLineIdx: lineIdx,

      };

    }

  }

  function isSelected(file: string, hunkIdx: number, lineIdx: number) {

    if (!selection || selection.file !== file) {

      return false;

    }

    return (

      hunkIdx >= selection.startHunkIdx &&

      hunkIdx <= selection.endHunkIdx &&

      (hunkIdx === selection.startHunkIdx

        ? lineIdx >= selection.startLineIdx

        : true) &&

      (hunkIdx === selection.endHunkIdx

        ? lineIdx <= selection.endLineIdx

        : true)

    );

  }

</script>

<style>

  .container {

    /* Make space for the box-shadow border, otherwise it gets cut off due to

       overflow: hide on the container. */

    padding: 8px 1px;

    font-size: var(--font-size-small);

    font-family: var(--font-family-monospace);

  }

  .line {

    display: flex;

    position: relative;

    white-space: pre-wrap;

  }

  .hunk-header {

    color: var(--color-foreground-dim);

  }

  .hunk-header > .left,

  .hunk-header > .right {

    cursor: default;

  }

  .addition {

    background-color: var(--color-fill-diff-green-light);

  }

  .deletion {

    background-color: var(--color-fill-diff-red-light);

  }

  .addition > .left,

  .addition > .right,

  .addition > .sign {

    color: var(--color-foreground-success);

  }

  .deletion > .left,

  .deletion > .right,

  .deletion > .sign {

    color: var(--color-foreground-red);

  }

  .context > .left,

  .context > .right,

  .context > .sign {

    color: var(--color-foreground-disabled);

  }

  .start-marker::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 4px;

    height: 4px;

    background-color: yellow;

    z-index: 1;

  }

  .end-marker::after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    height: 4px;

    width: 4px;

    background-color: cyan;

    z-index: 1;

  }

  /* Workaround for faking hover color change on end marker while dragging. */

  .start-marker,

  .end-marker {

    color: var(--color-foreground-contrast) !important;

  }

  /* Draw top border for first line on a multi-line selection. */

  .selected:has(.start-marker):not(.end-marker) {

    box-shadow: 0 -1px 0 0 var(--color-fill-secondary);

    z-index: 1;

  }

  /* Draw bottom border for last line on a multi-line selection. */

  .selected:has(.end-marker):not(.start-marker) {

    box-shadow: 0 1px 0 0 var(--color-fill-secondary);

    z-index: 1;

  }

  /* Draw left selection border for every selected line. */

  .selected > .left {

    box-shadow: -1px 0 0 0 var(--color-fill-secondary);

    z-index: 1;

  }

  /* Draw right selection border for every selected line. */

  .selected > .code {

    box-shadow: 1px 0 0 0 var(--color-fill-secondary);

    z-index: 1;

  }

  /* Draw all selection borders if a single line is selected regardless of

     the start and end markers being on only the left cell or left and right. */

  .selected:has(.start-marker.end-marker),

  .selected:has(.start-marker + .end-marker),

  .selected:has(.end-marker + .start-marker) {

    box-shadow: 0 0 0 1px var(--color-fill-secondary);

    z-index: 1;

  }

  .left,

  .right {

    min-width: 3rem;

    text-align: center;

    position: relative;

    cursor: cell;

  }

  .left:hover,

  .right:hover,

  .left:active,

  .right:active {

    color: var(--color-foreground-contrast);

  }

  .sign {

    min-width: 1.5rem;

  }

  .code {

    -webkit-touch-callout: initial;

    -webkit-user-select: text;

    user-select: text;

    width: 100%;

    word-break: break-word;

  }

  .comment-form {

    background-color: var(--color-fill-float-hover);

    font-family: var(--font-family-sans-serif);

    display: flex;

    flex-direction: column;

    padding: 1rem;

  }

  .comment-header {

    display: flex;

    background-color: var(--color-fill-ghost);

    clip-path: var(--1px-corner-fill);

    padding: 0 8px;

    width: fit-content;

    margin-bottom: 1rem;

  }

</style>

<svelte:window onpointerup={endDragSelection} onpointerdown={deselect} />

<div class="container">

  {#if file.diff.type === "plain"}

    {#each file.diff.hunks as hunk, hunkIdx}

      <div class="line hunk-header">

        <div class="left"></div>

        <div class="right"></div>

        <div class="sign"></div>

        <div class="code">{hunk.header}</div>

      </div>

      <div>

        {#each hunk.lines as line, lineIdx}

          <div

            class="line"

            class:addition={line.type === "addition"}

            class:deletion={line.type === "deletion"}

            class:context={line.type === "context"}

            class:selected={isSelected(

              filePath(file, "left"),

              hunkIdx,

              lineIdx,

            )}>

            <div

              class="left"

              class:start-marker={selection?.start.side === "left" &&

                selection.start.lineNumber === lineNumber(line, "left")}

              class:end-marker={selection?.end.side === "left" &&

                selection.end.lineNumber === lineNumber(line, "left")}

              onpointerdown={e => {

                if (e.shiftKey) {

                  endShiftSelection(e, file, "left", line, hunkIdx, lineIdx);

                } else {

                  startDragSelection(e, file, "left", line, hunkIdx, lineIdx);

                }

              }}

              onpointerup={endDragSelection}

              onpointerenter={() => {

                addToDragSelection(file, "left", line, hunkIdx, lineIdx);

              }}>

              {lineNumber(line, "left")}

            </div>

            <div

              class="right"

              class:start-marker={selection?.start.side === "right" &&

                selection.start.lineNumber === lineNumber(line, "right")}

              class:end-marker={selection?.end.side === "right" &&

                selection.end.lineNumber === lineNumber(line, "right")}

              onpointerdown={e => {

                if (e.shiftKey) {

                  endShiftSelection(e, file, "right", line, hunkIdx, lineIdx);

                } else {

                  startDragSelection(e, file, "right", line, hunkIdx, lineIdx);

                }

              }}

              onpointerup={endDragSelection}

              onpointerenter={() => {

                addToDragSelection(file, "right", line, hunkIdx, lineIdx);

              }}>

              {lineNumber(line, "right")}

            </div>

            <div class="sign">

              {#if line.type === "addition"}

                +

              {:else if line.type === "deletion"}

                -

              {/if}

            </div>

            {#if line.highlight && line.highlight.items.length > 0}

              <div class="code">

                {@html line.highlight.items

                  .map(

                    paint =>

                      `<span class="global-syntax ${paint.style}">${escape(paint.item)}</span>`,

                  )

                  .join("")}

              </div>

            {:else if line.line !== ""}

              <div class="code">

                {line.line}

              </div>

            {:else}

              <div class="code"><br /></div>

            {/if}

          </div>

          {#if !dragging && selection?.endHunkIdx === hunkIdx && selection.endLineIdx === lineIdx}

            <div

              class="comment-form"

              onpointerdown={e => {

                e.stopPropagation();

              }}>

              <div class="comment-header">

                {selection.file.split("/").length > 1

                  ? "…/"

                  : ""}{selection.file.split("/").slice(-1)}:{selection.start

                  .side === "left"

                  ? "L"

                  : "R"}{selection.start.lineNumber} ->

                {selection.end.side === "left" ? "L" : "R"}{selection.end

                  .lineNumber}

              </div>

              <CommentToggleInput

                disallowEmptyBody

                {rid}

                onclose={() => {

                  selection = undefined;

                }}

                focus

                placeholder="Leave a comment"

                submit={async (body, embeds) => {

                  if (selection === undefined || createComment === undefined) {

                    return;

                  }

                  await createComment(body, embeds, undefined, {

                    commit: head,

                    path: selection.file,

                    old: {

                      type: "lines",

                      range: { start: 0, end: 0 },

                    },

                    new: {

                      type: "lines",

                      range: { start: 0, end: 0 },

                    },

                  });

                }} />

            </div>

          {/if}

        {/each}

      </div>

    {/each}

  {/if}

</div>

<script lang="ts" module>

  type DiffView = "unified" | "split";

  export const diffView = writable<DiffView>(loadDiffView());

  function loadDiffView(): DiffView {

    const storedDiffView = localStorage

      ? localStorage.getItem("diffView")

      : null;

    if (storedDiffView === null) {

      return "unified";

    } else {

      return storedDiffView as DiffView;

    }

  }

  export function storeDiffView(newDiffView: DiffView): void {

    diffView.set(newDiffView);

    if (localStorage) {

      localStorage.setItem("diffView", newDiffView);

    } else {

      console.warn(

        "localStorage isn't available, not able to persist the selected diff view without it.",

      );

    }

  }

</script>

<script lang="ts">

  import { writable } from "svelte/store";

  import Icon from "./Icon.svelte";

  import Button from "./Button.svelte";

</script>

<style>

  .container {

    display: flex;

    align-items: center;

  }

</style>

<div class="container">

  <Button

    flatRight

    active={$diffView === "unified"}

    variant="ghost"

    onclick={() => {

      storeDiffView("unified");

    }}>

    <Icon name="unified" />

    Unified

  </Button>

  <Button

    flatLeft

    variant="ghost"

    active={$diffView === "split"}

    onclick={() => {

      storeDiffView("split");

    }}>

    <Icon name="split" />

    Split

  </Button>

</div>

    font-family: var(--font-family-sans-serif);

    leftHeader: Snippet;

    rightHeader?: Snippet;

    sticky?: boolean;

  let {

    children,

    expanded,

    leftHeader,

    rightHeader,

    sticky = true,

  }: Props = $props();

  {#if rightHeader}

    <div style:margin-left="auto" style:margin-right="1rem">

      {@render rightHeader()}

    </div>

  {/if}

<script lang="ts">

  import type { CodeLocation } from "@bindings/cob/thread/CodeLocation";

  import type { Embed } from "@bindings/cob/thread/Embed";

  import type { FileDiff } from "@bindings/diff/FileDiff";

  import type { Thread } from "@bindings/cob/thread/Thread";

  import Diff from "@app/components/Diff.svelte";

  import File from "@app/components/File.svelte";

  import Icon from "@app/components/Icon.svelte";

  import Path from "@app/components/Path.svelte";

  interface Props {

    file: FileDiff;

    expanded: boolean;

    rid: string;

    head: string;

    createComment?: (

      body: string,

      embeds: Embed[],

      replyTo?: string,

      location?: CodeLocation,

    ) => Promise<void>;

    codeCommentThreads?: Thread<CodeLocation>[];

  }

  const {

    file,

    expanded,

    rid,

    head,

    createComment,

    codeCommentThreads,

  }: Props = $props();

</script>

<style>

  .added {

    color: var(--color-foreground-success);

    background-color: var(--color-fill-diff-green-light);

  }

  .deleted {

    color: var(--color-foreground-red);

    background-color: var(--color-fill-diff-red-light);

  }

  .moved,

  .copied {

    color: var(--color-foreground-dim);

    background: var(--color-fill-ghost);

  }

  .stats {

    font-size: var(--font-size-tiny);

    font-family: var(--font-family-monospace);

    font-weight: var(--font-weight-semibold);

  }

</style>

{#snippet emptyPlaceholder()}

  <div class="global-flex" style:margin="1rem 0" style:justify-content="center">

    <Icon name="none" />Empty file

  </div>

{/snippet}

<File {expanded}>

  {#snippet leftHeader()}

    {#if file.status === "moved" || file.status === "copied"}

      <span style="display: flex; align-items: center; flex-wrap: wrap;">

        <Path fullPath={file.oldPath} />

        <span style:padding="0 0.5rem">→</span>

        <Path fullPath={file.newPath} />

      </span>

    {:else}

      <Path fullPath={file.path} />

    {/if}

    {#if file.status === "added"}

      <span class="global-counter added">added</span>

    {:else if file.status === "deleted"}

      <span class="global-counter deleted">deleted</span>

    {:else if file.status === "moved"}

      <span class="global-counter moved">moved</span>

    {:else if file.status === "copied"}

      <span class="global-counter copied">copied</span>

    {/if}

  {/snippet}

  {#snippet rightHeader()}

    {#if file.diff.type === "plain" && file.diff.hunks.length > 0}

      <div class="stats">

        <span style:color="var(--color-foreground-success)">

          +{file.diff.stats.additions}

        </span>

        <span style:color="var(--color-foreground-red)">

          -{file.diff.stats.deletions}

        </span>

      </div>

    {/if}

  {/snippet}

  {#snippet children()}

    {#if file.diff.type === "plain"}

      {#if file.diff.hunks.length > 0}

        <Diff {file} {rid} {createComment} {head} {codeCommentThreads} />

      {:else}

        {@render emptyPlaceholder()}

      {/if}

    {:else if file.diff.type === "binary"}

      <div

        class="global-flex"

        style:margin="1rem 0"

        style:justify-content="center">

        <Icon name="binary" />Binary file

      </div>

    {:else}

      {@render emptyPlaceholder()}

    {/if}

  {/snippet}

</File>

      | "binary"

      | "split"

      | "unified"

  {:else if name === "binary"}

    <path d="M10 3.5H11V4.5H10V3.5Z" />

    <path d="M11 4.5L12 4.5V5.5H11V4.5Z" />

    <path d="M10 5.5L12 5.5V6.5H10V5.5Z" />

    <path d="M9 5.5H10V6.5H9V5.5Z" />

    <path d="M8 4.5H9V5.5L8 5.5V4.5Z" />

    <path d="M8 2.5H9L9 4.5H8L8 2.5Z" />

    <path d="M9 2.5L10 2.5V3.5H9V2.5Z" />

    <path d="M4 13.5H12V14.5H4V13.5Z" />

    <path d="M4 1.5H9V2.5L4 2.5V1.5Z" />

    <path d="M13 5.5V13.5L12 13.5L12 5.5L13 5.5Z" />

    <path d="M4 2.5L4 13.5H3L3 2.5L4 2.5Z" />

    <path d="M5 9.5H6V11.5H5V9.5Z" />

    <path d="M7 9.5H8V11.5H7V9.5Z" />

    <path d="M6 11.5H7L7 12.5H6L6 11.5Z" />

    <path d="M6 8.5H7V9.5L6 9.5L6 8.5Z" />

    <path d="M9 9.5H10V10.5H9V9.5Z" />

    <path d="M10 8.5H11V12.5H10V8.5Z" />

    <path d="M5 4.5H6V5.5H5V4.5Z" />

    <path d="M6 3.5H7V7.5H6V3.5Z" />

  {:else if name === "split"}

    <path d="M2 3H3L3 13H2L2 3Z" />

    <path d="M9 3H10V8H9V3Z" />

    <path d="M6 8H7L7 13H6L6 8Z" />

    <path d="M3 2L6 2V3L3 3L3 2Z" />

    <path d="M10 2L13 2V3L10 3V2Z" />

    <path d="M3 13L6 13L6 14H3L3 13Z" />

    <path d="M10 13H13V14H10V13Z" />

    <path d="M13 3L14 3L14 13H13L13 3Z" />

    <path d="M4 6L8 6V7L4 7V6Z" />

    <path d="M8 9H12L12 10L8 10V9Z" />

    <path d="M9 11L10 11V13L9 13L9 11Z" />

    <path d="M6 3L7 3V5H6V3Z" />

  {:else if name === "unified"}

    <path d="M3 2.5L11 2.5V3.5L3 3.5V2.5Z" />

    <path d="M2 6.5L11 6.5V7.5L2 7.5V6.5Z" />

    <path d="M3 10.5H11V11.5L3 11.5V10.5Z" />

    <path d="M5 4.5L13 4.5V5.5L5 5.5V4.5Z" />

    <path d="M5 8.5L14 8.5V9.5L5 9.5V8.5Z" />

    <path d="M5 12.5L13 12.5V13.5L5 13.5V12.5Z" />

    <path d="M2 3.5L3 3.5L3 10.5H2L2 3.5Z" />

    <path d="M13 5.5L14 5.5L14 12.5H13L13 5.5Z" />

<script lang="ts">

  interface Props {

    fullPath: string;

  }

  const { fullPath }: Props = $props();

</script>

<style>

  .container {

    white-space: nowrap;

    -webkit-touch-callout: initial;

    -webkit-user-select: text;

    user-select: text;

  }

  .path {

    color: var(--color-fill-gray);

    font-weight: var(--font-weight-regular);

  }

  .filename {

    font-weight: var(--font-weight-semibold);

  }

</style>

<!-- prettier-ignore -->

<span class="txt-small container">

  <span class="path">

    {fullPath

      .match(/^.*\/|/)

      ?.values()

      .next().value}

  </span><span class="filename">

    {fullPath.split("/").slice(-1)}

  </span>

</span>

  import type { CodeLocation } from "@bindings/cob/thread/CodeLocation";

            (comment.location === undefined &&

              comment.id !== review.id &&

              !comment.replyTo) ||

  const codeCommentThreads = $derived(

    ((review.comments &&

      review.comments

        .filter(

          comment =>

            (comment.location !== undefined &&

              comment.id !== review.id &&

              !comment.replyTo) ||

            comment.replyTo === review.id,

        )

        .map(thread => {

          return {

            root: thread,

            replies:

              review.comments &&

              review.comments

                .filter(comment => comment.replyTo === thread.id)

                .sort((a, b) => a.edits[0].timestamp - b.edits[0].timestamp),

          };

        }, [])) as Thread<CodeLocation>[]) || [],

  );

    location?: CodeLocation,

          location,

  <Changes

    rid={repo.rid}

    showCommits={false}

    {codeCommentThreads}

    {patchId}

    {revision}

    {createComment} />

  import DiffViewSwitch from "./DiffViewSwitch.svelte";

          Diff view <DiffViewSwitch />

        </div>

        <div

          class="global-flex"

          style:justify-content="space-between"

          style:width="100%">