aboutsummaryrefslogtreecommitdiff
path: root/FrontEnd/src/app/views/home
diff options
context:
space:
mode:
Diffstat (limited to 'FrontEnd/src/app/views/home')
-rw-r--r--FrontEnd/src/app/views/home/BoardWithUser.tsx8
-rw-r--r--FrontEnd/src/app/views/home/BoardWithoutUser.tsx2
-rw-r--r--FrontEnd/src/app/views/home/TimelineCreateDialog.tsx39
-rw-r--r--FrontEnd/src/app/views/home/index.tsx4
4 files changed, 27 insertions, 26 deletions
diff --git a/FrontEnd/src/app/views/home/BoardWithUser.tsx b/FrontEnd/src/app/views/home/BoardWithUser.tsx
index dcd39cbe..fbe1dd89 100644
--- a/FrontEnd/src/app/views/home/BoardWithUser.tsx
+++ b/FrontEnd/src/app/views/home/BoardWithUser.tsx
@@ -62,9 +62,9 @@ const BoardWithUser: React.FC<{ user: UserWithToken }> = ({ user }) => {
}, [user, joinTimelines]);
return (
- <Row className="my-2 justify-content-center">
+ <Row className="my-3 justify-content-center">
{ownTimelines === "offline" && joinTimelines === "offline" ? (
- <Col className="py-2" sm="8" lg="6">
+ <Col sm="8" lg="6">
<OfflineBoard
onReload={() => {
setOwnTimelines("loading");
@@ -74,7 +74,7 @@ const BoardWithUser: React.FC<{ user: UserWithToken }> = ({ user }) => {
</Col>
) : (
<>
- <Col sm="6" lg="5" className="py-2">
+ <Col sm="6" lg="5" className="mb-3 mb-sm-0">
<TimelineBoard
title={t("home.ownTimeline")}
timelines={ownTimelines}
@@ -83,7 +83,7 @@ const BoardWithUser: React.FC<{ user: UserWithToken }> = ({ user }) => {
}}
/>
</Col>
- <Col sm="6" lg="5" className="py-2">
+ <Col sm="6" lg="5">
<TimelineBoard
title={t("home.joinTimeline")}
timelines={joinTimelines}
diff --git a/FrontEnd/src/app/views/home/BoardWithoutUser.tsx b/FrontEnd/src/app/views/home/BoardWithoutUser.tsx
index ebfddb50..7e30f799 100644
--- a/FrontEnd/src/app/views/home/BoardWithoutUser.tsx
+++ b/FrontEnd/src/app/views/home/BoardWithoutUser.tsx
@@ -34,7 +34,7 @@ const BoardWithoutUser: React.FC = () => {
}, [publicTimelines]);
return (
- <Row className="my-2 justify-content-center">
+ <Row className="my-3 justify-content-center">
{publicTimelines === "offline" ? (
<Col sm="8" lg="6">
<OfflineBoard
diff --git a/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx b/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx
index d9467719..786ebb5d 100644
--- a/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx
+++ b/FrontEnd/src/app/views/home/TimelineCreateDialog.tsx
@@ -20,27 +20,28 @@ const TimelineCreateDialog: React.FC<TimelineCreateDialogProps> = (props) => {
close={props.close}
titleColor="success"
title="home.createDialog.title"
- inputScheme={[
- {
- type: "text",
- label: "home.createDialog.name",
- helperText: "home.createDialog.nameFormat",
- validator: (name) => {
- if (name.length === 0) {
- return "home.createDialog.noEmpty";
- } else if (name.length > 26) {
- return "home.createDialog.tooLong";
- } else if (!validateTimelineName(name)) {
- return "home.createDialog.badFormat";
- } else {
- return null;
- }
+ inputScheme={
+ [
+ {
+ type: "text",
+ label: "home.createDialog.name",
+ helperText: "home.createDialog.nameFormat",
},
- },
- ]}
+ ] as const
+ }
+ inputValidator={([name]) => {
+ if (name.length === 0) {
+ return { 0: "home.createDialog.noEmpty" };
+ } else if (name.length > 26) {
+ return { 0: "home.createDialog.tooLong" };
+ } else if (!validateTimelineName(name)) {
+ return { 0: "home.createDialog.badFormat" };
+ } else {
+ return null;
+ }
+ }}
onProcess={([name]) => {
- nameSaved = name as string;
- return timelineService.createTimeline(nameSaved).toPromise();
+ return timelineService.createTimeline(name).toPromise();
}}
onSuccessAndClose={() => {
history.push(`timelines/${nameSaved}`);
diff --git a/FrontEnd/src/app/views/home/index.tsx b/FrontEnd/src/app/views/home/index.tsx
index 760adcea..0c36545c 100644
--- a/FrontEnd/src/app/views/home/index.tsx
+++ b/FrontEnd/src/app/views/home/index.tsx
@@ -34,8 +34,8 @@ const HomePage: React.FC = () => {
return (
<>
<Container fluid>
- <Row className="justify-content-center">
- <Col xs={12} sm={10} md={8} lg={6}>
+ <Row className="my-3 justify-content-center">
+ <Col xs={12} sm={8} lg={6}>
<SearchInput
className="justify-content-center"
value={navText}