Spaces:

firebird-technologies
/

NoteStack-Test

Runtime error

NoteStack-Test / frontend /src /components /ReportBody.tsx

Refactor code structure for improved readability and maintainability; removed redundant code blocks and optimized function calls.

0649f1b about 1 month ago

Raw History Blame Contribute Delete

1.15 kB

import { useState } from "react";
import { Link } from "react-router-dom";
import type { Artifact } from "../api/types";
import { ShareDialog } from "./ShareDialog";

/** What a finished report shows in a card: its format and size, and a way in or out to share it. */
export function ReportBody({ artifact }: { artifact: Artifact }) {
  const [sharing, setSharing] = useState(false);
  const c = artifact.content;
  const blocks = (c.blocks ?? []) as { type: string }[];
  const visuals = blocks.filter((b) => b.type !== "prose").length;
  return (
    <div className="artifact-body">
      <p className="muted">
        {c.format === "interactive" ? "Interactive" : "Document"} · {blocks.length} sections
        {visuals > 0 ? ` · ${visuals} visual${visuals === 1 ? "" : "s"}` : ""}
      </p>
      <div className="row">
        <Link className="btn btn-small" to={`/app/reports/${artifact.id}`}>Open report</Link>
        <button type="button" className="btn btn-small" onClick={() => setSharing(true)}>Share</button>
      </div>
      {sharing && <ShareDialog artifactId={artifact.id} onClose={() => setSharing(false)} />}
    </div>
  );
}

	import { useState } from "react";
	import { Link } from "react-router-dom";
	import type { Artifact } from "../api/types";
	import { ShareDialog } from "./ShareDialog";

	/** What a finished report shows in a card: its format and size, and a way in or out to share it. */
	export function ReportBody({ artifact }: { artifact: Artifact }) {
	const [sharing, setSharing] = useState(false);
	const c = artifact.content;
	const blocks = (c.blocks ?? []) as { type: string }[];
	const visuals = blocks.filter((b) => b.type !== "prose").length;
	return (
	<div className="artifact-body">
	<p className="muted">
	{c.format === "interactive" ? "Interactive" : "Document"} · {blocks.length} sections
	{visuals > 0 ? ` · ${visuals} visual${visuals === 1 ? "" : "s"}` : ""}
	</p>
	<div className="row">
	<Link className="btn btn-small" to={`/app/reports/${artifact.id}`}>Open report</Link>
	<button type="button" className="btn btn-small" onClick={() => setSharing(true)}>Share</button>
	</div>
	{sharing && <ShareDialog artifactId={artifact.id} onClose={() => setSharing(false)} />}
	</div>
	);
	}