FN-8031: render planning summaries as Markdown by default
Render planning summary descriptions as formatted Markdown on first display. - Initialize the planning summary view in Markdown preview mode. - Update interaction tests for preview-first description editing. - Add a patch changeset for the planning summary behavior. Files changed: .changeset/fn-8031-planning-summary-markdown.md | 7 +++++++ .../dashboard/app/components/PlanningModeModal.tsx | 6 +++++- .../PlanningModeModal.ui-interactions.test.tsx | 21 +++++++++++++++------ 3 files changed, 27 insertions(+), 7 deletions(-) Fusion-Task-Id: FN-8031 Fusion-Task-Lineage: 4e0647a4-a44c-4774-937f-c9e6144837de Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
This commit is contained in:
7
.changeset/fn-8031-planning-summary-markdown.md
Normal file
7
.changeset/fn-8031-planning-summary-markdown.md
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
---
|
||||||
|
"@runfusion/fusion": patch
|
||||||
|
---
|
||||||
|
|
||||||
|
summary: Planning summary description now renders formatted markdown by default.
|
||||||
|
category: feature
|
||||||
|
dev: Initializes the Planning summary renderMarkdown state to true.
|
||||||
@@ -3018,7 +3018,11 @@ function SummaryView({
|
|||||||
const { t } = useTranslation("app");
|
const { t } = useTranslation("app");
|
||||||
const summary = normalizePlanningSummary(rawSummary);
|
const summary = normalizePlanningSummary(rawSummary);
|
||||||
const [isExpanded, setIsExpanded] = useState(false);
|
const [isExpanded, setIsExpanded] = useState(false);
|
||||||
const [renderMarkdown, setRenderMarkdown] = useState(false);
|
/*
|
||||||
|
FNXC:PlanningSummaryDescription 2026-07-15-12:00:
|
||||||
|
Planning summaries must show formatted Markdown on first display. The existing toggle switches to raw Plain text for editing and back to the preview.
|
||||||
|
*/
|
||||||
|
const [renderMarkdown, setRenderMarkdown] = useState(true);
|
||||||
const [selectedDependencies, setSelectedDependencies] = useState<string[]>(
|
const [selectedDependencies, setSelectedDependencies] = useState<string[]>(
|
||||||
summary.suggestedDependencies
|
summary.suggestedDependencies
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -977,8 +977,17 @@ describe("PlanningModeModal", () => {
|
|||||||
it("toggles description between plain textarea and formatted markdown preview", async () => {
|
it("toggles description between plain textarea and formatted markdown preview", async () => {
|
||||||
const { container } = await renderPlanningSummary("## Heading\n\n- item\n\n**bold**");
|
const { container } = await renderPlanningSummary("## Heading\n\n- item\n\n**bold**");
|
||||||
|
|
||||||
expect(container.querySelector(".planning-textarea")).not.toBeNull();
|
expect(container.querySelector(".planning-description-preview")).not.toBeNull();
|
||||||
expect(container.querySelector(".planning-description-preview")).toBeNull();
|
expect(container.querySelector(".planning-textarea")).toBeNull();
|
||||||
|
expect(screen.getByRole("heading", { level: 2, name: "Heading" })).toBeDefined();
|
||||||
|
expect(container.querySelector("strong")?.textContent).toBe("bold");
|
||||||
|
|
||||||
|
fireEvent.click(screen.getByTestId("planning-description-markdown-toggle"));
|
||||||
|
|
||||||
|
await waitFor(() => {
|
||||||
|
expect(container.querySelector(".planning-textarea")).not.toBeNull();
|
||||||
|
expect(container.querySelector(".planning-description-preview")).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
fireEvent.click(screen.getByTestId("planning-description-markdown-toggle"));
|
fireEvent.click(screen.getByTestId("planning-description-markdown-toggle"));
|
||||||
|
|
||||||
@@ -987,12 +996,6 @@ describe("PlanningModeModal", () => {
|
|||||||
expect(screen.getByRole("heading", { level: 2, name: "Heading" })).toBeDefined();
|
expect(screen.getByRole("heading", { level: 2, name: "Heading" })).toBeDefined();
|
||||||
expect(container.querySelector("strong")?.textContent).toBe("bold");
|
expect(container.querySelector("strong")?.textContent).toBe("bold");
|
||||||
});
|
});
|
||||||
|
|
||||||
fireEvent.click(screen.getByTestId("planning-description-markdown-toggle"));
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(container.querySelector(".planning-textarea")).not.toBeNull();
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
it.each([
|
it.each([
|
||||||
@@ -1002,6 +1005,7 @@ describe("PlanningModeModal", () => {
|
|||||||
mockViewport(viewport);
|
mockViewport(viewport);
|
||||||
const user = userEvent.setup();
|
const user = userEvent.setup();
|
||||||
await renderPlanningSummary("Generated summary with existing words");
|
await renderPlanningSummary("Generated summary with existing words");
|
||||||
|
fireEvent.click(screen.getByTestId("planning-description-markdown-toggle"));
|
||||||
|
|
||||||
const textarea = screen.getByLabelText("Description") as HTMLTextAreaElement;
|
const textarea = screen.getByLabelText("Description") as HTMLTextAreaElement;
|
||||||
textarea.focus();
|
textarea.focus();
|
||||||
@@ -1028,6 +1032,11 @@ describe("PlanningModeModal", () => {
|
|||||||
expect(markdownToggle.closest("label")).toBeNull();
|
expect(markdownToggle.closest("label")).toBeNull();
|
||||||
expect(expandButton.closest("label")).toBeNull();
|
expect(expandButton.closest("label")).toBeNull();
|
||||||
|
|
||||||
|
expect(container.querySelector(".planning-description-preview")).not.toBeNull();
|
||||||
|
expect(container.querySelector(".planning-textarea")).toBeNull();
|
||||||
|
|
||||||
|
fireEvent.click(markdownToggle);
|
||||||
|
|
||||||
const textarea = container.querySelector<HTMLTextAreaElement>(".planning-textarea");
|
const textarea = container.querySelector<HTMLTextAreaElement>(".planning-textarea");
|
||||||
expect(textarea).not.toBeNull();
|
expect(textarea).not.toBeNull();
|
||||||
expect(textarea?.classList.contains("expanded")).toBe(false);
|
expect(textarea?.classList.contains("expanded")).toBe(false);
|
||||||
|
|||||||
Reference in New Issue
Block a user