Skip to content
Snippets Groups Projects
Commit a55ca24f authored by xaralis's avatar xaralis
Browse files

feat: improve formatting of program entry descriptions

parent 27b240a1
No related branches found
No related tags found
No related merge requests found
Pipeline #2018 passed
...@@ -5,6 +5,7 @@ import property from "lodash/property"; ...@@ -5,6 +5,7 @@ import property from "lodash/property";
import { createAsyncAction, errorResult, successResult } from "pullstate"; import { createAsyncAction, errorResult, successResult } from "pullstate";
import { fetch } from "api"; import { fetch } from "api";
import { markdownConverter } from "markdown";
import { ProgramStore } from "stores"; import { ProgramStore } from "stores";
import { loadPosts } from "./posts"; import { loadPosts } from "./posts";
...@@ -39,6 +40,11 @@ export const loadProgram = createAsyncAction( ...@@ -39,6 +40,11 @@ export const loadProgram = createAsyncAction(
"proposer", "proposer",
"speakers", "speakers",
]), ]),
fullTitle:
entry.number !== ""
? `${entry.number}. ${entry.title}`
: entry.title,
htmlContent: markdownConverter.makeHtml(entry.description),
discussionOpened: entry.discussion_opened, discussionOpened: entry.discussion_opened,
expectedStartAt: parse( expectedStartAt: parse(
entry.expected_start_at, entry.expected_start_at,
......
...@@ -8,7 +8,6 @@ import Button from "components/Button"; ...@@ -8,7 +8,6 @@ import Button from "components/Button";
import Chip from "components/Chip"; import Chip from "components/Chip";
import ModalConfirm from "components/modals/ModalConfirm"; import ModalConfirm from "components/modals/ModalConfirm";
import { useActionState, useItemActionConfirm } from "hooks"; import { useActionState, useItemActionConfirm } from "hooks";
import { markdownConverter } from "markdown";
import { AuthStore, ProgramStore } from "stores"; import { AuthStore, ProgramStore } from "stores";
const Schedule = () => { const Schedule = () => {
...@@ -49,10 +48,9 @@ const Schedule = () => { ...@@ -49,10 +48,9 @@ const Schedule = () => {
{scheduleIds.map((id) => { {scheduleIds.map((id) => {
const isCurrent = id === currentId; const isCurrent = id === currentId;
const entry = items[id]; const entry = items[id];
const fullTitle = `${entry.number}. ${entry.title}`; const htmlContent = entry.htmlContent
const htmlContent = !!entry.description
? { ? {
__html: markdownConverter.makeHtml(entry.description), __html: entry.htmlContent,
} }
: null; : null;
return ( return (
...@@ -76,11 +74,11 @@ const Schedule = () => { ...@@ -76,11 +74,11 @@ const Schedule = () => {
</p> </p>
</div> </div>
<div className="flex-grow w-full"> <div className="flex-grow w-full">
<h2 className="head-heavy-xs md:head-heavy-base mb-1"> <h2 className="head-heavy-xs md:head-heavy-base mb-2">
{isCurrent && <Link to="/">{fullTitle}</Link>} {isCurrent && <Link to="/">{entry.fullTitle}</Link>}
{!isCurrent && fullTitle} {!isCurrent && entry.fullTitle}
</h2> </h2>
<div className="leading-normal sm:flex sm:space-x-4"> <div className="leading-snug">
<div className="space-x-2"> <div className="space-x-2">
<strong>Navrhovatel:</strong> <strong>Navrhovatel:</strong>
<span>{entry.proposer}</span> <span>{entry.proposer}</span>
...@@ -94,7 +92,7 @@ const Schedule = () => { ...@@ -94,7 +92,7 @@ const Schedule = () => {
</div> </div>
{htmlContent && ( {htmlContent && (
<div <div
className="mt-2 leading-tight max-w-3xl content-block" className="mt-2 leading-snug max-w-3xl content-block"
dangerouslySetInnerHTML={htmlContent} dangerouslySetInnerHTML={htmlContent}
/> />
)} )}
......
import has from "lodash/has"; import has from "lodash/has";
import { markdownConverter } from "markdown";
import { ProgramStore } from "stores"; import { ProgramStore } from "stores";
export const handleProgramEntryChanged = (payload) => { export const handleProgramEntryChanged = (payload) => {
ProgramStore.update((state) => { ProgramStore.update((state) => {
if (state.items[payload.id]) { const entry = state.items[payload.id];
if (entry) {
if (has(payload, "discussion_opened")) { if (has(payload, "discussion_opened")) {
state.items[payload.id].discussionOpened = payload.discussion_opened; state.items[payload.id].discussionOpened = payload.discussion_opened;
} }
if (has(payload, "title")) { if (has(payload, "title")) {
state.items[payload.id].title = payload.title; state.items[payload.id].title = payload.title;
state.items[payload.id].fullTitle =
entry.number !== "" ? `${entry.number}. ${entry.title}` : entry.title;
} }
if (has(payload, "description")) { if (has(payload, "description")) {
state.items[payload.id].description = payload.description; state.items[payload.id].description = payload.description;
state.items[payload.id].htmlContent = markdownConverter.makeHtml(
payload.description
);
} }
} }
}); });
......
...@@ -14,10 +14,12 @@ declare namespace CF2021 { ...@@ -14,10 +14,12 @@ declare namespace CF2021 {
id: number; id: number;
number: string; number: string;
title: string; title: string;
fullTitle: string;
proposer: string; proposer: string;
speakers: string; speakers: string;
discussionOpened: boolean; discussionOpened: boolean;
description?: string; description?: string;
htmlContent?: string;
expectedStartAt: Date; expectedStartAt: Date;
expectedFinishAt?: Date; expectedFinishAt?: Date;
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment