Merge branch 'feature/element-rich-text'
This commit is contained in:
commit
2c79ab64ad
19 changed files with 130 additions and 4 deletions
|
|
@ -46,6 +46,7 @@ class ElementController
|
|||
'id' => $element->getId(),
|
||||
'title' => $element->getTitle(),
|
||||
'description' => $element->getDescription(),
|
||||
'richText' => $element->getRichText(),
|
||||
],
|
||||
], 200);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ class CreateElementDto
|
|||
public Set $set,
|
||||
public string $title,
|
||||
public string $description,
|
||||
public string $richText,
|
||||
public ?Element $parentElement,
|
||||
) {
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ class Element
|
|||
private int $id,
|
||||
private string $title,
|
||||
private string $description,
|
||||
private string $richText,
|
||||
private Set $set,
|
||||
private ?Element $parentElement,
|
||||
) {
|
||||
|
|
@ -30,6 +31,11 @@ class Element
|
|||
return $this->description;
|
||||
}
|
||||
|
||||
public function getRichText(): string
|
||||
{
|
||||
return $this->richText;
|
||||
}
|
||||
|
||||
public function getSet(): Set
|
||||
{
|
||||
return $this->set;
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ use Illuminate\Database\Eloquent\Model;
|
|||
* @property int $set_id
|
||||
* @property string $title
|
||||
* @property string $description
|
||||
* @property string $rich_text
|
||||
* @property int|null $parent_element_id
|
||||
*
|
||||
* @method static Builder<static>|ElementModel newModelQuery()
|
||||
|
|
@ -20,6 +21,7 @@ use Illuminate\Database\Eloquent\Model;
|
|||
* @method static Builder<static>|ElementModel whereSetId($value)
|
||||
* @method static Builder<static>|ElementModel whereTitle($value)
|
||||
* @method static Builder<static>|ElementModel whereDescription($value)
|
||||
* @method static Builder<static>|ElementModel whereRichText($value)
|
||||
*
|
||||
* @mixin \Eloquent
|
||||
*/
|
||||
|
|
@ -33,6 +35,7 @@ class ElementModel extends Model
|
|||
'set_id',
|
||||
'title',
|
||||
'description',
|
||||
'rich_text',
|
||||
'parent_element_id',
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ class EloquentElementRepository implements ElementRepository
|
|||
'set_id' => $dto->set->getId(),
|
||||
'title' => $dto->title,
|
||||
'description' => $dto->description,
|
||||
'rich_text' => $dto->richText,
|
||||
'parent_element_id' => $dto->parentElement?->getId(),
|
||||
]);
|
||||
|
||||
|
|
@ -25,6 +26,7 @@ class EloquentElementRepository implements ElementRepository
|
|||
id: $model->id,
|
||||
title: $dto->title,
|
||||
description: $dto->description,
|
||||
richText: $dto->richText,
|
||||
set: $dto->set,
|
||||
parentElement: $dto->parentElement,
|
||||
);
|
||||
|
|
@ -105,6 +107,7 @@ class EloquentElementRepository implements ElementRepository
|
|||
id: $model->id,
|
||||
title: $model->title,
|
||||
description: $model->description,
|
||||
richText: $model->rich_text,
|
||||
set: $set,
|
||||
parentElement: $parentElement,
|
||||
);
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ class CreateElement
|
|||
throw new BadRequestException('title is required');
|
||||
}
|
||||
$description = $request->description ?? '';
|
||||
$richText = $request->richText ?? '';
|
||||
|
||||
$set = $this->setRepo->find($request->setId);
|
||||
if ($set === null) {
|
||||
|
|
@ -46,6 +47,7 @@ class CreateElement
|
|||
set: $set,
|
||||
title: $request->title,
|
||||
description: $description,
|
||||
richText: $richText,
|
||||
parentElement: null,
|
||||
));
|
||||
}
|
||||
|
|
@ -68,6 +70,7 @@ class CreateElement
|
|||
set: $set,
|
||||
title: $request->title,
|
||||
description: $description,
|
||||
richText: $richText,
|
||||
parentElement: $parentElement,
|
||||
));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ class CreateElementRequest
|
|||
public ?int $setId,
|
||||
public ?string $title,
|
||||
public ?string $description,
|
||||
public ?string $richText,
|
||||
public ?int $parentElementId,
|
||||
) {
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ return new class extends Migration
|
|||
$table->foreignId('set_id')->constrained('sets');
|
||||
$table->string('title');
|
||||
$table->text('description')->default('');
|
||||
$table->text('rich_text')->default('');
|
||||
$table->foreignId('parent_element_id')
|
||||
->nullable()
|
||||
->constrained('elements');
|
||||
|
|
|
|||
|
|
@ -18,6 +18,9 @@ class ElementSeeder extends Seeder
|
|||
set: $baderechSet,
|
||||
title: $baderechSet->getName(),
|
||||
description: $baderechSet->getDescription(),
|
||||
richText: '<p>Begin with a clear map for avodah growth.</p>'
|
||||
. '<p><strong>Move steadily</strong> from awareness '
|
||||
. 'to practice.</p>',
|
||||
parentElement: null,
|
||||
));
|
||||
$elementRepository->create(new CreateElementDto(
|
||||
|
|
@ -25,12 +28,16 @@ class ElementSeeder extends Seeder
|
|||
title: 'Avodah Foundations',
|
||||
description: 'Core foundations for building a steady '
|
||||
. 'avodah practice.',
|
||||
richText: '<p>Avodah foundations begin with honest awareness '
|
||||
. 'and small repeatable steps.</p>',
|
||||
parentElement: $rootElement,
|
||||
));
|
||||
$elementRepository->create(new CreateElementDto(
|
||||
set: $baderechSet,
|
||||
title: 'Daily Practice',
|
||||
description: 'Practical steps for consistent daily growth.',
|
||||
richText: '<p>Daily practice turns inspiration into a '
|
||||
. 'dependable rhythm.</p>',
|
||||
parentElement: $rootElement,
|
||||
));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@ class FakeElementRepository implements ElementRepository
|
|||
id: $id,
|
||||
title: $dto->title,
|
||||
description: $dto->description,
|
||||
richText: $dto->richText,
|
||||
set: $dto->set,
|
||||
parentElement: $dto->parentElement,
|
||||
);
|
||||
|
|
@ -97,6 +98,7 @@ class FakeElementRepository implements ElementRepository
|
|||
id: $element->getId(),
|
||||
title: $element->getTitle(),
|
||||
description: $element->getDescription(),
|
||||
richText: $element->getRichText(),
|
||||
set: $element->getSet(),
|
||||
parentElement: $parentElement,
|
||||
);
|
||||
|
|
|
|||
|
|
@ -26,18 +26,21 @@ class ElementsEndpointTest extends TestCase
|
|||
set: $set,
|
||||
title: 'Baderech HaAvodah',
|
||||
description: 'A structured path for growth',
|
||||
richText: '<p>A structured path for growth</p>',
|
||||
parentElement: null,
|
||||
));
|
||||
$firstChildElement = $elementRepository->create(new CreateElementDto(
|
||||
set: $set,
|
||||
title: 'Avodah Foundations',
|
||||
description: 'Foundations for steady avodah',
|
||||
richText: '<p>Foundations rich text</p>',
|
||||
parentElement: $element,
|
||||
));
|
||||
$secondChildElement = $elementRepository->create(new CreateElementDto(
|
||||
set: $set,
|
||||
title: 'Daily Practice',
|
||||
description: 'Daily practices for growth',
|
||||
richText: '<p>Daily practice rich text</p>',
|
||||
parentElement: $element,
|
||||
));
|
||||
|
||||
|
|
@ -61,6 +64,7 @@ class ElementsEndpointTest extends TestCase
|
|||
'id' => $element->getId(),
|
||||
'title' => 'Baderech HaAvodah',
|
||||
'description' => 'A structured path for growth',
|
||||
'richText' => '<p>A structured path for growth</p>',
|
||||
],
|
||||
]);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,6 +32,7 @@ class SetsEndpointTest extends TestCase
|
|||
set: $baderechSet,
|
||||
title: $baderechSet->getName(),
|
||||
description: $baderechSet->getDescription(),
|
||||
richText: '',
|
||||
parentElement: null,
|
||||
)
|
||||
);
|
||||
|
|
|
|||
|
|
@ -30,18 +30,21 @@ class ElementControllerTest extends TestCase
|
|||
$set,
|
||||
'Baderech HaAvodah',
|
||||
'A structured path for growth',
|
||||
'<p>A structured path for growth</p>',
|
||||
null,
|
||||
);
|
||||
$firstChildElement = $this->createElement(
|
||||
$set,
|
||||
'Avodah Foundations',
|
||||
'Foundations for steady avodah',
|
||||
'<p>Foundations rich text</p>',
|
||||
$element,
|
||||
);
|
||||
$secondChildElement = $this->createElement(
|
||||
$set,
|
||||
'Daily Practice',
|
||||
'Daily practices for growth',
|
||||
'<p>Daily practice rich text</p>',
|
||||
$element,
|
||||
);
|
||||
|
||||
|
|
@ -55,6 +58,10 @@ class ElementControllerTest extends TestCase
|
|||
'A structured path for growth',
|
||||
$body['element']['description'],
|
||||
);
|
||||
$this->assertSame(
|
||||
'<p>A structured path for growth</p>',
|
||||
$body['element']['richText'],
|
||||
);
|
||||
$this->assertSame([
|
||||
[
|
||||
'id' => $firstChildElement->getId(),
|
||||
|
|
@ -105,12 +112,14 @@ class ElementControllerTest extends TestCase
|
|||
DomainSet $set,
|
||||
string $title,
|
||||
string $description,
|
||||
string $richText,
|
||||
?Element $parentElement,
|
||||
): Element {
|
||||
return $this->elementRepo->create(new CreateElementDto(
|
||||
set: $set,
|
||||
title: $title,
|
||||
description: $description,
|
||||
richText: $richText,
|
||||
parentElement: $parentElement,
|
||||
));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ class ElementTest extends TestCase
|
|||
id: 1,
|
||||
title: 'Root',
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
set: $set,
|
||||
parentElement: null,
|
||||
);
|
||||
|
|
@ -27,6 +28,7 @@ class ElementTest extends TestCase
|
|||
id: 2,
|
||||
title: 'Child',
|
||||
description: 'Child description',
|
||||
richText: '<p>Child rich text</p>',
|
||||
set: $set,
|
||||
parentElement: $rootElement,
|
||||
);
|
||||
|
|
@ -37,6 +39,10 @@ class ElementTest extends TestCase
|
|||
'Child description',
|
||||
$childElement->getDescription(),
|
||||
);
|
||||
$this->assertSame(
|
||||
'<p>Child rich text</p>',
|
||||
$childElement->getRichText(),
|
||||
);
|
||||
$this->assertSame($set, $childElement->getSet());
|
||||
$this->assertSame($rootElement, $childElement->getParentElement());
|
||||
$this->assertNull($rootElement->getParentElement());
|
||||
|
|
|
|||
|
|
@ -48,12 +48,14 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Root',
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
parentElementId: null,
|
||||
));
|
||||
|
||||
$this->assertInstanceOf(Element::class, $element);
|
||||
$this->assertSame('Root', $element->getTitle());
|
||||
$this->assertSame('Root description', $element->getDescription());
|
||||
$this->assertSame('<p>Root rich text</p>', $element->getRichText());
|
||||
$this->assertSame($set->getId(), $element->getSet()->getId());
|
||||
$this->assertNull($element->getParentElement());
|
||||
}
|
||||
|
|
@ -66,6 +68,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Root',
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
parentElementId: null,
|
||||
)
|
||||
);
|
||||
|
|
@ -75,6 +78,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Child',
|
||||
description: 'Child description',
|
||||
richText: '<p>Child rich text</p>',
|
||||
parentElementId: $rootElement->getId(),
|
||||
)
|
||||
);
|
||||
|
|
@ -84,13 +88,17 @@ class CreateElementTest extends TestCase
|
|||
'Child description',
|
||||
$childElement->getDescription(),
|
||||
);
|
||||
$this->assertSame(
|
||||
'<p>Child rich text</p>',
|
||||
$childElement->getRichText(),
|
||||
);
|
||||
$this->assertSame(
|
||||
$rootElement->getId(),
|
||||
$childElement->getParentElement()->getId(),
|
||||
);
|
||||
}
|
||||
|
||||
public function testCreatesElementWithBlankDescriptionWhenMissing(): void
|
||||
public function testCreatesElementWithBlankContentWhenMissing(): void
|
||||
{
|
||||
$set = $this->createSet('Daily learning');
|
||||
|
||||
|
|
@ -98,10 +106,12 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Root',
|
||||
description: null,
|
||||
richText: null,
|
||||
parentElementId: null,
|
||||
));
|
||||
|
||||
$this->assertSame('', $element->getDescription());
|
||||
$this->assertSame('', $element->getRichText());
|
||||
}
|
||||
|
||||
public function testThrowsWhenSetIdMissing(): void
|
||||
|
|
@ -113,6 +123,7 @@ class CreateElementTest extends TestCase
|
|||
setId: null,
|
||||
title: 'Root',
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
parentElementId: null,
|
||||
));
|
||||
}
|
||||
|
|
@ -126,6 +137,7 @@ class CreateElementTest extends TestCase
|
|||
setId: 1,
|
||||
title: null,
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
parentElementId: null,
|
||||
));
|
||||
}
|
||||
|
|
@ -139,6 +151,7 @@ class CreateElementTest extends TestCase
|
|||
setId: 99,
|
||||
title: 'Root',
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
parentElementId: null,
|
||||
));
|
||||
}
|
||||
|
|
@ -156,6 +169,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Child',
|
||||
description: 'Child description',
|
||||
richText: '<p>Child rich text</p>',
|
||||
parentElementId: 99,
|
||||
));
|
||||
}
|
||||
|
|
@ -167,6 +181,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Root',
|
||||
description: 'Root description',
|
||||
richText: '<p>Root rich text</p>',
|
||||
parentElementId: null,
|
||||
));
|
||||
|
||||
|
|
@ -179,6 +194,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $set->getId(),
|
||||
title: 'Another root',
|
||||
description: 'Another root description',
|
||||
richText: '<p>Another root rich text</p>',
|
||||
parentElementId: null,
|
||||
));
|
||||
}
|
||||
|
|
@ -192,6 +208,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $parentSet->getId(),
|
||||
title: 'Parent root',
|
||||
description: 'Parent root description',
|
||||
richText: '<p>Parent root rich text</p>',
|
||||
parentElementId: null,
|
||||
)
|
||||
);
|
||||
|
|
@ -205,6 +222,7 @@ class CreateElementTest extends TestCase
|
|||
setId: $childSet->getId(),
|
||||
title: 'Invalid child',
|
||||
description: 'Invalid child description',
|
||||
richText: '<p>Invalid child rich text</p>',
|
||||
parentElementId: $parentElement->getId(),
|
||||
));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ class GetElementTest extends TestCase
|
|||
$set,
|
||||
'Baderech HaAvodah',
|
||||
'A structured path for growth',
|
||||
'<p>A structured path for growth</p>',
|
||||
null,
|
||||
);
|
||||
|
||||
|
|
@ -46,6 +47,10 @@ class GetElementTest extends TestCase
|
|||
'A structured path for growth',
|
||||
$foundElement->getDescription(),
|
||||
);
|
||||
$this->assertSame(
|
||||
'<p>A structured path for growth</p>',
|
||||
$foundElement->getRichText(),
|
||||
);
|
||||
}
|
||||
|
||||
public function testReturnsDirectChildElements(): void
|
||||
|
|
@ -55,24 +60,28 @@ class GetElementTest extends TestCase
|
|||
$set,
|
||||
'Baderech HaAvodah',
|
||||
'A structured path for growth',
|
||||
'<p>A structured path for growth</p>',
|
||||
null,
|
||||
);
|
||||
$firstChildElement = $this->createElement(
|
||||
$set,
|
||||
'Avodah Foundations',
|
||||
'Foundations for steady avodah',
|
||||
'<p>Foundations rich text</p>',
|
||||
$parentElement,
|
||||
);
|
||||
$secondChildElement = $this->createElement(
|
||||
$set,
|
||||
'Daily Practice',
|
||||
'Daily practices for growth',
|
||||
'<p>Daily practice rich text</p>',
|
||||
$parentElement,
|
||||
);
|
||||
$this->createElement(
|
||||
$set,
|
||||
'Nested Practice',
|
||||
'Nested description',
|
||||
'<p>Nested rich text</p>',
|
||||
$firstChildElement,
|
||||
);
|
||||
$otherSet = $this->createSet(2, 'Daily Learning');
|
||||
|
|
@ -80,12 +89,14 @@ class GetElementTest extends TestCase
|
|||
$otherSet,
|
||||
'Other Parent',
|
||||
'Other parent description',
|
||||
'<p>Other parent rich text</p>',
|
||||
null,
|
||||
);
|
||||
$this->createElement(
|
||||
$otherSet,
|
||||
'Other Child',
|
||||
'Other child description',
|
||||
'<p>Other child rich text</p>',
|
||||
$otherParentElement,
|
||||
);
|
||||
|
||||
|
|
@ -145,12 +156,14 @@ class GetElementTest extends TestCase
|
|||
DomainSet $set,
|
||||
string $title,
|
||||
string $description,
|
||||
string $richText,
|
||||
?Element $parentElement,
|
||||
): Element {
|
||||
return $this->elementRepo->create(new CreateElementDto(
|
||||
set: $set,
|
||||
title: $title,
|
||||
description: $description,
|
||||
richText: $richText,
|
||||
parentElement: $parentElement,
|
||||
));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -41,7 +41,17 @@ describe('media page sets', () => {
|
|||
cy.location('pathname').should('eq', '/element/1')
|
||||
cy.get('[data-cy="element-page"]').should('be.visible')
|
||||
cy.contains('h1', 'Baderech HaAvodah').should('be.visible')
|
||||
cy.get('[data-cy="element-rich-text"]').within(() => {
|
||||
cy.contains('Begin with a clear map for avodah growth.')
|
||||
.should('be.visible')
|
||||
cy.contains('strong', 'Move steadily').should('be.visible')
|
||||
})
|
||||
cy.get('[data-cy="child-element-list"]').should('be.visible')
|
||||
cy.get('[data-cy="child-element-list"]')
|
||||
.should(
|
||||
'not.contain.text',
|
||||
'Avodah foundations begin with honest awareness',
|
||||
)
|
||||
cy.contains('[data-cy="child-element-link"]', 'Avodah Foundations')
|
||||
.as('avodahFoundationsLink')
|
||||
.should('have.attr', 'href', '/element/2')
|
||||
|
|
@ -63,5 +73,10 @@ describe('media page sets', () => {
|
|||
.click()
|
||||
cy.location('pathname').should('eq', '/element/2')
|
||||
cy.contains('h1', 'Avodah Foundations').should('be.visible')
|
||||
cy.get('[data-cy="element-rich-text"]')
|
||||
.should(
|
||||
'contain.text',
|
||||
'Avodah foundations begin with honest awareness',
|
||||
)
|
||||
})
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,22 +1,26 @@
|
|||
import { ref } from 'vue'
|
||||
import { defineStore } from 'pinia'
|
||||
|
||||
export interface Element {
|
||||
export interface ChildElement {
|
||||
id: number
|
||||
title: string
|
||||
description: string
|
||||
}
|
||||
|
||||
export interface Element extends ChildElement {
|
||||
richText: string
|
||||
}
|
||||
|
||||
interface ElementResponse {
|
||||
element: Element
|
||||
childElements: Element[]
|
||||
childElements: ChildElement[]
|
||||
}
|
||||
|
||||
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL as string
|
||||
|
||||
export const useElementsStore = defineStore('elements', () => {
|
||||
const element = ref<Element | null>(null)
|
||||
const childElements = ref<Element[]>([])
|
||||
const childElements = ref<ChildElement[]>([])
|
||||
const isLoading = ref(false)
|
||||
const error = ref<string | null>(null)
|
||||
|
||||
|
|
|
|||
|
|
@ -49,6 +49,13 @@ watch(
|
|||
{{ element.title }}
|
||||
</h1>
|
||||
|
||||
<div
|
||||
v-if="element.richText !== ''"
|
||||
class="element-page__rich-text"
|
||||
data-cy="element-rich-text"
|
||||
v-html="element.richText"
|
||||
/>
|
||||
|
||||
<nav
|
||||
v-if="childElements.length > 0"
|
||||
class="element-page__children"
|
||||
|
|
@ -109,6 +116,27 @@ watch(
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.element-page__rich-text {
|
||||
margin-top: 1.75rem;
|
||||
color: #333333;
|
||||
font-family: var(--font-sans);
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.75;
|
||||
}
|
||||
|
||||
.element-page__rich-text :deep(p) {
|
||||
margin: 0 0 1rem;
|
||||
}
|
||||
|
||||
.element-page__rich-text :deep(p:last-child) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.element-page__rich-text :deep(strong) {
|
||||
color: #2c2c2c;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.element-page__children {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue