aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--FrontEnd/src/app/http/timeline.ts3
-rw-r--r--FrontEnd/src/app/index.sass2
-rw-r--r--FrontEnd/src/app/locales/en/translation.ts1
-rw-r--r--FrontEnd/src/app/locales/scheme.ts1
-rw-r--r--FrontEnd/src/app/locales/zh/translation.ts1
-rw-r--r--FrontEnd/src/app/views/common/UserTimelineLogo.tsx2
-rw-r--r--FrontEnd/src/app/views/home/TimelineBoard.tsx9
-rw-r--r--FrontEnd/src/app/views/home/home.sass21
-rw-r--r--FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx1
-rw-r--r--FrontEnd/src/app/views/timeline-common/TimelinePropertyChangeDialog.tsx11
-rw-r--r--FrontEnd/src/app/views/timeline/TimelineInfoCard.tsx7
-rw-r--r--FrontEnd/src/app/views/user/UserInfoCard.tsx8
-rw-r--r--FrontEnd/webpack.config.dev.js6
13 files changed, 50 insertions, 23 deletions
diff --git a/FrontEnd/src/app/http/timeline.ts b/FrontEnd/src/app/http/timeline.ts
index eb7d5065..71c49852 100644
--- a/FrontEnd/src/app/http/timeline.ts
+++ b/FrontEnd/src/app/http/timeline.ts
@@ -23,6 +23,7 @@ export type TimelineVisibility = typeof kTimelineVisibilities[number];
export interface HttpTimelineInfo {
uniqueId: string;
+ title: string;
name: string;
description: string;
owner: HttpUser;
@@ -95,6 +96,7 @@ export interface HttpTimelinePostPostRequest {
}
export interface HttpTimelinePatchRequest {
+ title?: string;
visibility?: TimelineVisibility;
description?: string;
}
@@ -121,6 +123,7 @@ export class HttpTimelineNameConflictError extends Error {
interface RawTimelineInfo {
uniqueId: string;
+ title: string;
name: string;
description: string;
owner: HttpUser;
diff --git a/FrontEnd/src/app/index.sass b/FrontEnd/src/app/index.sass
index 8e87e4ac..0202e633 100644
--- a/FrontEnd/src/app/index.sass
+++ b/FrontEnd/src/app/index.sass
@@ -50,9 +50,9 @@ textarea
.cru-card
@extend .shadow
@extend .border
- @extend .border-primary
@extend .rounded
@extend .bg-light
+ border-color: $gray-200
.full-viewport-center-child
position: fixed
diff --git a/FrontEnd/src/app/locales/en/translation.ts b/FrontEnd/src/app/locales/en/translation.ts
index c7f33d1e..d88a3376 100644
--- a/FrontEnd/src/app/locales/en/translation.ts
+++ b/FrontEnd/src/app/locales/en/translation.ts
@@ -74,6 +74,7 @@ const translation: TranslationResource = {
},
dialogChangeProperty: {
title: "Change Timeline Properties",
+ titleField: "Title",
visibility: "Visibility",
description: "Description",
},
diff --git a/FrontEnd/src/app/locales/scheme.ts b/FrontEnd/src/app/locales/scheme.ts
index 9e3534ac..dcb478cc 100644
--- a/FrontEnd/src/app/locales/scheme.ts
+++ b/FrontEnd/src/app/locales/scheme.ts
@@ -65,6 +65,7 @@ export default interface TranslationResource {
};
dialogChangeProperty: {
title: string;
+ titleField: string;
visibility: string;
description: string;
};
diff --git a/FrontEnd/src/app/locales/zh/translation.ts b/FrontEnd/src/app/locales/zh/translation.ts
index df316366..71f0d9fc 100644
--- a/FrontEnd/src/app/locales/zh/translation.ts
+++ b/FrontEnd/src/app/locales/zh/translation.ts
@@ -70,6 +70,7 @@ const translation: TranslationResource = {
},
dialogChangeProperty: {
title: "修改时间线属性",
+ titleField: "标题",
visibility: "可见性",
description: "描述",
},
diff --git a/FrontEnd/src/app/views/common/UserTimelineLogo.tsx b/FrontEnd/src/app/views/common/UserTimelineLogo.tsx
index 29f6a69f..19b9fee5 100644
--- a/FrontEnd/src/app/views/common/UserTimelineLogo.tsx
+++ b/FrontEnd/src/app/views/common/UserTimelineLogo.tsx
@@ -15,7 +15,7 @@ const UserTimelineLogo: React.FC<UserTimelineLogoProps> = (props) => {
<circle cx="50" cy="50" r="22" />
<line x1="50" x2="50" y1="75" y2="100" />
</g>
- <g fill={color}>
+ <g fill={coercedColor}>
<circle cx="85" cy="75" r="10" />
<path d="m70,100c0,0 15,-30 30,0.25" />
</g>
diff --git a/FrontEnd/src/app/views/home/TimelineBoard.tsx b/FrontEnd/src/app/views/home/TimelineBoard.tsx
index a3d176e1..c2a7e5fe 100644
--- a/FrontEnd/src/app/views/home/TimelineBoard.tsx
+++ b/FrontEnd/src/app/views/home/TimelineBoard.tsx
@@ -48,20 +48,21 @@ const TimelineBoard: React.FC<TimelineBoardProps> = (props) => {
);
} else {
return timelines.map((timeline) => {
- const { name } = timeline;
+ const { name, title } = timeline;
const isPersonal = name.startsWith("@");
const url = isPersonal
? `/users/${timeline.owner.username}`
: `/timelines/${name}`;
return (
- <div key={name} className="timeline-board-item">
+ <Link key={name} to={url} className="timeline-board-item">
{isPersonal ? (
<UserTimelineLogo className="icon" />
) : (
<TimelineLogo className="icon" />
)}
- <Link to={url}>{name}</Link>
- </div>
+ {title}
+ <small className="ml-2 text-secondary">{name}</small>
+ </Link>
);
});
}
diff --git a/FrontEnd/src/app/views/home/home.sass b/FrontEnd/src/app/views/home/home.sass
index 28a2e5f3..0c01019b 100644
--- a/FrontEnd/src/app/views/home/home.sass
+++ b/FrontEnd/src/app/views/home/home.sass
@@ -1,13 +1,18 @@
-.timeline-board-item
- font-size: 1.1em
- @extend .my-2
- .icon
- height: 1.3em
- @extend .mr-2
-
.timeline-board
@extend .cru-card
@extend .d-flex
@extend .flex-column
- @extend .p-3
+ @extend .py-3
min-height: 200px
+
+.timeline-board-item
+ font-size: 1.1em
+ @extend .px-3
+ @extend .py-2
+ transition: background 0.3s
+ .icon
+ height: 1.3em
+ color: black
+ @extend .mr-2
+ &:hover
+ background: $gray-300
diff --git a/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx b/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx
index d5c91622..0f792b53 100644
--- a/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx
+++ b/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx
@@ -76,6 +76,7 @@ export default function TimelinePageTemplate<TManageItem>(
open
close={closeDialog}
oldInfo={{
+ title: timeline.title,
visibility: timeline.visibility,
description: timeline.description,
}}
diff --git a/FrontEnd/src/app/views/timeline-common/TimelinePropertyChangeDialog.tsx b/FrontEnd/src/app/views/timeline-common/TimelinePropertyChangeDialog.tsx
index 87638f31..223525f9 100644
--- a/FrontEnd/src/app/views/timeline-common/TimelinePropertyChangeDialog.tsx
+++ b/FrontEnd/src/app/views/timeline-common/TimelinePropertyChangeDialog.tsx
@@ -11,6 +11,7 @@ import OperationDialog, {
} from "../common/OperationDialog";
export interface TimelinePropertyInfo {
+ title: string;
visibility: TimelineVisibility;
description: string;
}
@@ -37,6 +38,11 @@ const TimelinePropertyChangeDialog: React.FC<TimelinePropertyChangeDialogProps>
titleColor="default"
inputScheme={[
{
+ type: "text",
+ label: "timeline.dialogChangeProperty.titleField",
+ initValue: props.oldInfo.title,
+ },
+ {
type: "select",
label: "timeline.dialogChangeProperty.visibility",
options: kTimelineVisibilities.map<OperationSelectInputInfoOption>(
@@ -55,8 +61,11 @@ const TimelinePropertyChangeDialog: React.FC<TimelinePropertyChangeDialogProps>
]}
open={props.open}
close={props.close}
- onProcess={([newVisibility, newDescription]) => {
+ onProcess={([newTitle, newVisibility, newDescription]) => {
const req: TimelineChangePropertyRequest = {};
+ if (newTitle !== props.oldInfo.title) {
+ req.title = newTitle as string;
+ }
if (newVisibility !== props.oldInfo.visibility) {
req.visibility = newVisibility as TimelineVisibility;
}
diff --git a/FrontEnd/src/app/views/timeline/TimelineInfoCard.tsx b/FrontEnd/src/app/views/timeline/TimelineInfoCard.tsx
index 2d787709..abc3d0c9 100644
--- a/FrontEnd/src/app/views/timeline/TimelineInfoCard.tsx
+++ b/FrontEnd/src/app/views/timeline/TimelineInfoCard.tsx
@@ -37,10 +37,11 @@ const TimelineInfoCard: React.FC<TimelineInfoCardProps> = (props) => {
toggleCollapse={toggleCollapse}
>
<h3 className="text-primary mx-3 d-inline-block align-middle">
- {timeline.name}
+ {timeline.title}
+ <small className="ml-3 text-secondary">{timeline.name}</small>
</h3>
- <div className="d-inline-block align-middle">
- <BlobImage blob={avatar} className="avatar small rounded-circle" />
+ <div className="align-middle">
+ <BlobImage blob={avatar} className="avatar small rounded-circle mr-3" />
{timeline.owner.nickname}
<small className="ml-3 text-secondary">
@{timeline.owner.username}
diff --git a/FrontEnd/src/app/views/user/UserInfoCard.tsx b/FrontEnd/src/app/views/user/UserInfoCard.tsx
index 888fb18a..e4edd80d 100644
--- a/FrontEnd/src/app/views/user/UserInfoCard.tsx
+++ b/FrontEnd/src/app/views/user/UserInfoCard.tsx
@@ -35,8 +35,12 @@ const UserInfoCard: React.FC<UserInfoCardProps> = (props) => {
collapse={collapse}
toggleCollapse={toggleCollapse}
>
- <div>
- <BlobImage blob={avatar} className="avatar" />
+ <h3 className="text-primary mx-3 d-inline-block align-middle">
+ {timeline.title}
+ <small className="ml-3 text-secondary">{timeline.name}</small>
+ </h3>
+ <div className="align-middle">
+ <BlobImage blob={avatar} className="avatar small rounded-circle mr-3" />
{timeline.owner.nickname}
<small className="ml-3 text-secondary">
@{timeline.owner.username}
diff --git a/FrontEnd/webpack.config.dev.js b/FrontEnd/webpack.config.dev.js
index 937ab3fb..75665431 100644
--- a/FrontEnd/webpack.config.dev.js
+++ b/FrontEnd/webpack.config.dev.js
@@ -6,6 +6,8 @@ const config = require("./webpack.common");
config.mode("development");
+config.target('web'); // Remove this after https://github.com/webpack/webpack-dev-server/issues/2758 is fixed.
+
config.module
.rule("ts")
.use("babel")
@@ -42,12 +44,10 @@ config.resolve.set("fallback", {
config.devServer
.contentBase(path.resolve(__dirname, "public/"))
- .host("0.0.0.0")
.port(3000)
.historyApiFallback(true)
- .hotOnly(true);
+ .hot(true);
-config.plugin("hot").use(webpack.HotModuleReplacementPlugin);
config.plugin("react-refresh").use(new ReactRefreshWebpackPlugin());
module.exports = config.toConfig();
generated by cgit v1.2.3 (git 2.46.0) at 2025-09-28 19:26:17 +0000