fix react-toastify 😎

This commit is contained in:
Aarni Halinen
2021-03-30 21:55:16 +03:00
parent f02b07d8ef
commit ca9d517475
13 changed files with 34 additions and 57 deletions
+3
View File
@@ -3,9 +3,11 @@ import React from "react";
import type { AppProps /* , AppContext' */ } from "next/app";
import Head from "next/head";
import styled, { createGlobalStyle } from "styled-components";
import { ToastContainer } from "react-toastify";
import { colors } from "@theme/colors";
import "react-mde/lib/styles/css/react-mde-all.css";
import "react-toastify/dist/ReactToastify.css";
const fontFamily = "'Montserrat', sans-serif";
const fontSize = 12; // 16px
@@ -141,6 +143,7 @@ const Web20App = ({ Component, pageProps }: AppProps) => (
<AppContainer>
<Component {...pageProps} />
</AppContainer>
<ToastContainer position="bottom-right" />
</>
);
+4 -4
View File
@@ -1,6 +1,7 @@
import React, { useEffect, useState } from "react";
import { NextPage } from "next";
import { useRouter } from "next/router";
import { toast } from "react-toastify";
import AdminCreateCommon from "@views/admin/AdminCreateCommon";
import Tag from "@models/Tag";
import TagApi from "@api/tagApi";
@@ -11,7 +12,6 @@ import EventApi from "@api/eventApi";
import DatetimeWidget from "@components/Widgets/DatetimeWidget";
import SectionDividerWidget from "@components/Widgets/SectionDividerWidget";
import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
import { toast } from "react-toastify";
const widgets = {
datetime: DatetimeWidget,
@@ -213,7 +213,7 @@ const EventCreatePage: NextPage = () => {
// resp.signupForm = (resp.signupForm as any).map(inst => inst.id);
resp.tags = data.formData.tags;
resp.signupForm = data.formData.signupForm;
toast("Event created successfully 😎");
toast.success("Event created successfully 😎");
router.push("/admin/events");
setFormData(resp);
} else {
@@ -224,12 +224,12 @@ const EventCreatePage: NextPage = () => {
// resp.signupForm = (resp.signupForm as any).map(inst => inst.id);
resp.tags = data.formData.tags;
resp.signupForm = data.formData.signupForm;
toast("Event updated successfully 😎");
toast.success("Event updated successfully 😎");
router.push("/admin/events");
setFormData(resp);
}
} catch (err) {
toast("Uh oh! Something went wrong! Try again later. 😟");
toast.error("Uh oh! Something went wrong! Try again later. 😟");
setError(err);
}
};
+3 -3
View File
@@ -167,18 +167,18 @@ const FeedCreatePage: NextPage = () => {
if (payload.id === undefined) {
const resp = await FeedApi.createPost(payload);
// resp.tags = resp.tags;
toast("Post created successfully 😎");
toast.success("Post created successfully 😎");
router.push("/admin/feed");
setFormData(resp);
} else {
const resp = await FeedApi.updatePost(payload);
// resp.tags = resp.tag_id;
toast("Post updated successfully 😎");
toast.success("Post updated successfully 😎");
router.push("/admin/feed");
setFormData(resp);
}
} catch (err) {
toast("Uh oh! Something went wrong! Try again later. 😟");
toast.error("Uh oh! Something went wrong! Try again later. 😟");
setError(err);
}
};
+3 -3
View File
@@ -132,17 +132,17 @@ const JobAdCreatePage: NextPage = () => {
const payload = data.formData;
if (payload.id === undefined) {
const resp = await JobAdApi.createJobAd(payload);
toast("Job ad created successfully 😎");
toast.success("Job ad created successfully 😎");
router.push("/admin/jobads");
setFormData(resp);
} else {
const resp = await JobAdApi.updateJobAd(payload);
toast("Job ad updated successfully 😎");
toast.success("Job ad updated successfully 😎");
router.push("/admin/jobads");
setFormData(resp);
}
} catch (err) {
toast("Uh oh! Something went wrong! Try again later. 😟");
toast.error("Uh oh! Something went wrong! Try again later. 😟");
setError(err);
}
};
+3 -3
View File
@@ -133,7 +133,7 @@ const SignupCreatePage: NextPage = () => {
if (payload.id === undefined) {
const resp = await SignupApi.createForm(payload);
toast("Sign-up created successfully 😎");
toast.success("Sign-up created successfully 😎");
router.push("/admin/signups");
setFormData({
...resp,
@@ -141,7 +141,7 @@ const SignupCreatePage: NextPage = () => {
});
} else {
const resp = await SignupApi.updateForm(payload);
toast("Sign-up updated successfully 😎");
toast.success("Sign-up updated successfully 😎");
router.push("/admin/signups");
setFormData({
...resp,
@@ -149,7 +149,7 @@ const SignupCreatePage: NextPage = () => {
});
}
} catch (err) {
toast("Uh oh! Something went wrong! Try again later. 😟");
toast.error("Uh oh! Something went wrong! Try again later. 😟");
setError(err);
}
};
+3 -9
View File
@@ -1,6 +1,7 @@
import React, { useEffect, useState } from "react";
import { NextPage } from "next";
import { useRouter } from "next/router";
import { toast } from "react-toastify";
import AdminCreateCommon from "@views/admin/AdminCreateCommon";
import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
import { SignupForm } from "@models/Signup";
@@ -63,33 +64,26 @@ const SignupEmailPage: NextPage = () => {
const signupForm = useInitializeData(id as string);
const [error, setError] = useState<string>(null);
const [statusMessage, setStatusMessage] = useState<string>(null);
const onSubmit = async (data) => {
try {
const payload = data.formData;
await SignupApi.signupFormSendEmail(payload, Number(id));
setStatusMessage("Email sent successfully");
toast.success("Email sent successfully 😎");
} catch (err) {
setError(err);
toast.error("Uh oh! Something went wrong! Try again later. 😟");
}
};
// const onChange = (data) => setFormData(data.formData);
const onFocus = () => setStatusMessage(null);
const title = signupForm ? signupForm.title_fi : "Loading...";
return (
<AdminCreateCommon
title={title}
// formData={formData}
schema={buildSchema(title)}
UISchema={buildUISchema()}
// onChange={onChange}
onFocus={onFocus}
onSubmit={onSubmit}
statusMessage={statusMessage}
error={error}
widgets={widgets}
/>
+5 -6
View File
@@ -1,7 +1,8 @@
import React, { useState } from "react";
import React from "react";
import { NextPage, GetStaticProps, GetStaticPaths } from "next";
import Head from "next/head";
import { useRouter } from "next/router";
import { toast } from "react-toastify";
import { Signup, SignupForm } from "@models/Signup";
import SignupApi from "@api/signupApi";
import SignUpPageView from "@views/SignUpPage/SignUpPageView";
@@ -15,7 +16,6 @@ type InitialProps = {
const SignUpPage: NextPage<InitialProps> = ({ form }) => {
const router = useRouter();
const [statusMessage, setStatus] = useState(null);
if (router.isFallback) {
return <LoadingView />;
@@ -29,11 +29,11 @@ const SignUpPage: NextPage<InitialProps> = ({ form }) => {
try {
await SignupApi.createSignup(payload);
// TODO: Fetch/update signup list, so user sees the signup in the list
setStatus("Sign-up submitted successfully");
toast.success("Sign-up submitted successfully 😎");
router.push(window.location.href); // TODO: Fetch/update signup list, so user sees the signup in the list
} catch (error) {
console.error(error);
setStatus("Bad request");
toast.error("Uh oh! Sign-up failed! 😟");
}
};
@@ -46,7 +46,6 @@ const SignUpPage: NextPage<InitialProps> = ({ form }) => {
<SignUpPageView
signUpForm={form}
formData={{}}
statusMessage={statusMessage}
onChange={noop}
onSubmit={onSubmit}
/>
+3 -4
View File
@@ -1,6 +1,7 @@
import React, { useEffect, useState } from "react";
import { NextPage } from "next";
import { useRouter } from "next/router";
import { toast } from "react-toastify";
import { Signup, SignupForm } from "@models/Signup";
import SignupApi from "@api/signupApi";
import SignUpPageView from "@views/SignUpPage/SignUpPageView";
@@ -48,7 +49,6 @@ const useFetchSignup = (signupId: number, uuid: string) => {
const EditSignUpPage: NextPage = () => {
const router = useRouter();
const { signupId, uuid } = parseQueryParams(router.query);
const [statusMessage, setStatus] = useState(null);
const [form, formData] = useFetchSignup(signupId, uuid);
const onSubmit = async (data) => {
@@ -61,10 +61,10 @@ const EditSignUpPage: NextPage = () => {
try {
await SignupApi.updateSignup(payload, uuid);
// TODO: Update signup list, so user sees possible changes in the list
setStatus("Sign-up submission updated successfully");
toast.success("Sign-up updated successfully 😎");
} catch (error) {
console.error(error);
setStatus("Bad request");
toast.error("Uh oh! Updating sign-up failed! 😟");
}
};
@@ -73,7 +73,6 @@ const EditSignUpPage: NextPage = () => {
<SignUpPageView
signUpForm={form}
formData={formData}
statusMessage={statusMessage}
onChange={noop}
onSubmit={onSubmit}
/>
-5
View File
@@ -18,7 +18,6 @@ const customWidgets = {
interface SignUpPageViewProps {
signUpForm: SignupForm;
formData: any;
statusMessage: string;
onChange: (e: IChangeEvent<unknown>, es?: ErrorSchema) => unknown;
onSubmit: (e: ISubmitEvent<unknown>) => unknown;
}
@@ -62,7 +61,6 @@ const StyledSection = styled(TextSection)`
const SignUpPageView: React.FC<SignUpPageViewProps> = ({
signUpForm,
formData,
statusMessage,
onChange,
onSubmit,
}) => {
@@ -97,9 +95,6 @@ const SignUpPageView: React.FC<SignUpPageViewProps> = ({
</h1>
<div>
<span className="sign-up-statusmessage">
{statusMessage}
</span>
{form}
</div>
<aside>
+1 -14
View File
@@ -16,14 +16,6 @@ const Common = styled.div`
}
`;
const SuccessMsg = styled.p`
margin-bottom: 0.5rem;
border: 1px solid ${colors.green1};
padding: 8px 16px;
color: ${colors.green1};
display: inline-block;
`;
const ErrorMsg = styled.p`
margin-bottom: 0.5rem;
border: 1px solid ${colors.orange2};
@@ -44,9 +36,8 @@ type AdminCreateCommonProps = {
[name: string]: unknown;
};
onChange?: (e: IChangeEvent<FormTypes>, es?: ErrorSchema) => unknown;
onFocus: (id: string, value: string | number | boolean) => void;
onFocus?: (id: string, value: string | number | boolean) => void;
onSubmit: (e: ISubmitEvent<FormTypes>) => unknown;
statusMessage: string;
error: string;
widgets: {
[name: string]: any;
@@ -61,7 +52,6 @@ const AdminCreateCommon: React.FC<AdminCreateCommonProps> = ({
onChange,
onFocus,
onSubmit,
statusMessage,
error,
widgets,
}) => {
@@ -74,9 +64,6 @@ const AdminCreateCommon: React.FC<AdminCreateCommonProps> = ({
<AdminPageWrapper requiresAuthentication>
<Common>
<h1>{title}</h1>
{statusMessage && (
<SuccessMsg data-e2e="admin-form-status-message">{statusMessage}</SuccessMsg>
)}
<FormWrapper
schema={schema}
uiSchema={UISchema}
+2 -2
View File
@@ -81,10 +81,10 @@ test("Logged in user can create event", async (t) => {
// eslint-disable-next-line no-param-reassign
t.fixtureCtx.eventId = parsed.id;
const statusMessage = Selector("[data-e2e=\"admin-form-status-message\"]");
const statusMessage = Selector(".Toastify__toast-body");
await t
.hover(statusMessage)
.expect(
statusMessage.innerText,
).eql("Event created successfully");
).eql("Event created successfully 😎");
});
+2 -2
View File
@@ -86,10 +86,10 @@ test("Logged in user can create signup", async (t) => {
// eslint-disable-next-line no-param-reassign
t.fixtureCtx.formId = parsed.id;
const statusMessage = Selector("[data-e2e=\"admin-form-status-message\"]");
const statusMessage = Selector(".Toastify__toast-body");
await t
.hover(statusMessage)
.expect(
statusMessage.innerText,
).eql("Sign-up created successfully");
).eql("Sign-up created successfully 😎");
});
+2 -2
View File
@@ -52,10 +52,10 @@ test("User signups to event from front page", async (t) => {
await t.click(Selector("button").nth(-1));
const statusMessage = Selector(".sign-up-statusmessage");
const statusMessage = Selector(".Toastify__toast-body");
await t
.hover(statusMessage)
.expect(
statusMessage.innerText,
).eql("Sign-up submitted successfully");
).eql("Sign-up submitted successfully 😎");
});