blog/frontend/src/lib/post/adapter/presenter/labelViewModel.ts
SquidSpirit 3cb69f6e7c
All checks were successful
Frontend CI / build (push) Successful in 1m8s
BLOG-45 Post content page (#67)
### Description

- Implement the content page
  - Parse markdown formant content to html by `markdown-it`
  - Use `sanitize-html` to prevent from XSS attack
  - Style the html with `tailwindcss-typography`
- Fix the issue when backend parse the password to url
- Fix and make the post info list from backend always sorted by id

### Package Changes

### Rust

```toml
percent-encoding = "2.3.1"
```

### Node

```json
{
  "@types/markdown-it": "^14.1.2",
  "@types/sanitize-html": "^2.16.0",
  "markdown-it": "^14.1.0",
  "sanitize-html": "^2.17.0"
}
```

### Screenshots

|Desktop|Mobile|
|-|-|
|![image.png](/attachments/0ec5718a-f804-432f-8e4b-e9dc22c080d2)|![beta.squidspirit.com_post(iPhone 12 Pro) (1).png](/attachments/b30d1b96-d4a4-4b2b-b9bd-90fd2592ab52)|

### Reference

Resolves #45

### Checklist

- [x] A milestone is set
- [x] The related issuse has been linked to this branch

Reviewed-on: #67
Co-authored-by: SquidSpirit <squid@squidspirit.com>
Co-committed-by: SquidSpirit <squid@squidspirit.com>
2025-07-24 22:20:58 +08:00

48 lines
1.0 KiB
TypeScript

import {
ColorViewModel,
type DehydratedColorProps
} from '$lib/post/adapter/presenter/colorViewModel';
import type { Label } from '$lib/post/domain/entity/label';
export class LabelViewModel {
readonly id: number;
readonly name: string;
readonly color: ColorViewModel;
private constructor(props: { id: number; name: string; color: ColorViewModel }) {
this.id = props.id;
this.name = props.name;
this.color = props.color;
}
static fromEntity(label: Label): LabelViewModel {
return new LabelViewModel({
id: label.id,
name: label.name,
color: ColorViewModel.fromEntity(label.color)
});
}
static rehydrate(props: DehydratedLabelProps): LabelViewModel {
return new LabelViewModel({
id: props.id,
name: props.name,
color: ColorViewModel.rehydrate(props.color)
});
}
dehydrate(): DehydratedLabelProps {
return {
id: this.id,
name: this.name,
color: this.color.dehydrate()
};
}
}
export interface DehydratedLabelProps {
id: number;
name: string;
color: DehydratedColorProps;
}