{header}
{text && ({text}
)} -{start_time}
-{title}
-{text}
- {button} -{datetime}
+{title}
+{text}
+ {button} +- {name_fi} -
-- {name_en} + {committee.name_fi || committee.name_en}
- {contacts.map(occupation => (
- occupation.officials.map(official => (
+ {committee.roles.map((role) => (
+ role.representatives.map((representative) => (
= ({ first_name, last_name, phone, email, image, role }) => {
- const fullName = `${first_name} ${last_name}`;
- return(
-
+const ContactCard: React.FC = ({
+ name, phone, email, image, role_fi, role_en,
+}) => (
+
+ {image ? (
- 
-
-
-
- )
-}
+ ) : null}
+
+
+
+);
export default ContactCard;
diff --git a/src/components/DropDownBox.tsx b/src/components/DropDownBox.tsx
index f27eb1b..3a6425a 100644
--- a/src/components/DropDownBox.tsx
+++ b/src/components/DropDownBox.tsx
@@ -13,7 +13,7 @@ const Box = styled.div`
margin-top: 0.8rem;
position: absolute;
left: 0;
- top: 30px;
+ top: 2.5rem;
z-index: 20;
a {
@@ -23,7 +23,9 @@ const Box = styled.div`
}
`;
-const DropDownBox: React.FC = ({ children, onMouseEnter, onMouseLeave, visible }) => (
+const DropDownBox: React.FC = ({
+ children, onMouseEnter, onMouseLeave, visible,
+}) => (
(
+ <>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+);
diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
index 04cfabf..4d40c15 100644
--- a/src/components/Footer/Footer.tsx
+++ b/src/components/Footer/Footer.tsx
@@ -1,6 +1,7 @@
import React from "react";
import styled from "styled-components";
-import { colors } from "@theme/colors";
+import colors from "@theme/colors";
+import breakpoints from "@theme/breakpoints";
import FooterContent from "./FooterContent";
const StyledFooter = styled.footer`
@@ -16,27 +17,27 @@ const CopyRight = styled.div`
background-color: ${colors.black};
text-align: center;
justify-content: center;
- font-size: 12px;
+ font-size: 0.75rem;
padding: 1rem 0;
p {
padding: 0.5rem 1rem;
margin: 0;
- font-size: 14px;
+ font-size: 0.8rem;
}
a {
display: block;
text-decoration: underline;
padding: 0.4rem 0;
- font-size: 14px;
+ font-size: 0.8rem;
&:hover {
text-decoration: none;
}
}
- @media screen and (max-width: 600px) {
+ @media screen and (max-width: ${breakpoints.mobile}) {
flex-flow: column nowrap;
}
`;
@@ -49,6 +50,6 @@ const Footer: React.FC = () => (
webmaster: sik-vtmk@list.ayy.fi
-)
+);
export default Footer;
diff --git a/src/components/Footer/FooterContent.tsx b/src/components/Footer/FooterContent.tsx
index fdf11dc..5c9830d 100644
--- a/src/components/Footer/FooterContent.tsx
+++ b/src/components/Footer/FooterContent.tsx
@@ -1,23 +1,32 @@
import React from "react";
import styled from "styled-components";
-import Anchor from "../Anchor";
-import { colors } from "@theme/colors";
+import { Link } from "@components/index";
+import colors from "@theme/colors";
+import breakpoints from "@theme/breakpoints";
+
+const Columns = styled.div`
+ display: flex;
+ justify-content: space-between;
+ & > div > div {
+ margin-bottom: 1rem;
+ }
+`;
const Content = styled.div`
display: flex;
& > div:first-of-type {
- padding: 48px 0;
+ padding: 3rem 0;
flex: 2 1;
& > * {
- padding: 0 24px;
+ padding: 0 1.5rem;
}
}
h4 {
color: ${colors.lightBlue};
- padding: 24px 0;
+ padding: 1.5rem 0;
}
a {
@@ -25,7 +34,7 @@ const Content = styled.div`
display: block;
text-decoration: underline;
padding: 0.4rem 0;
- font-size: 14px;
+ font-size: 0.8rem;
&:hover {
text-decoration: none;
@@ -36,26 +45,18 @@ const Content = styled.div`
color: ${colors.white};
margin: 0;
padding: 0.4rem 0;
- font-size: 14px;
+ font-size: 0.8rem;
}
`;
const MarginSpace = styled.div`
- max-width: 600px;
+ max-width: 67%;
margin: auto;
`;
-const Columns = styled.div`
- display: flex;
- justify-content: space-between;
- & > div > div {
- margin-bottom: 1rem;
- }
-`;
-
const Map = styled.div`
flex: 1;
- @media screen and (max-width: 800px) {
+ @media screen and (max-width: ${breakpoints.mobile}) {
display: none;
}
iframe {
@@ -78,14 +79,14 @@ const FooterContent: React.FC = () => (
Yhteystiedot
+ Yhteystiedot
{fullName}
-{phone}
-{email}
-{role.name_fi}
-{role.name_en}
-{name}
+{role_fi || role_en}
+ {phone ?{phone}
: null} + {email ?{email}
: null} +Y-tunnus: 1627010-1
sik-hallitus@list.ayy.fi
-
- Jäseneksi
- Palaute
- Arkisto
- Materiaalipankki
+ Jäseneksi
+ Palaute
+ Arkisto
+ Materiaalipankki
@@ -99,6 +100,6 @@ const FooterContent: React.FC = () => (
/>
-)
+);
export default FooterContent;
diff --git a/src/components/HTMLLogo.tsx b/src/components/HTMLLogo.tsx
new file mode 100644
index 0000000..6101999
--- /dev/null
+++ b/src/components/HTMLLogo.tsx
@@ -0,0 +1,56 @@
+import React from "react";
+
+// eslint-disable-next-line react/display-name
+export default (): JSX.Element => (
+ `,
+ }}
+ />
+);
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 8a28282..45ad2a2 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -2,19 +2,20 @@ import React, { useState, useEffect, useRef } from "react";
import Navigation from "./Navigation";
import throttle from "lodash/throttle";
import styled from "styled-components";
-import { colors } from "@theme/colors";
+import colors from "@theme/colors";
+import breakpoints from "@theme/breakpoints";
import NavigationMobile from "./NavigationMobile";
import HeaderLogo from "./HeaderLogo";
-const StyledHeader = styled.header<{isHidden?: boolean}>`
+const StyledHeader = styled.header`
display: flex;
flex-flow: row nowrap;
- @media screen and (max-width: 600px) {
+ @media screen and (max-width: ${breakpoints.mobile}) {
flex-flow: column nowrap;
}
`;
-const Sticky = styled.div`
+const Sticky = styled.div<{$isHidden?: boolean}>`
position: sticky;
top: 0;
z-index: 10;
@@ -23,50 +24,46 @@ const Sticky = styled.div`
background-color: ${colors.darkBlue};
transition: all 200ms ease-out;
- ${(p) => p.isHidden ? (`
+ ${(p) => (p.$isHidden ? (`
transition: all 200ms ease-in;
transform: translateY(-100%);
- `) : null}
+ `) : null)}
`;
-
const PREVENT_IS_HIDDEN_Y = 150;
const Header: React.FC = () => {
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
const [isHidden, setHidden] = useState(false);
const yCoord = useRef(0);
-
- const handleScroll = () => {
- const newCoord = window.pageYOffset;
- if (!mobileMenuOpen && newCoord > yCoord.current && newCoord > PREVENT_IS_HIDDEN_Y) {
- setHidden(true);
- } else {
- setHidden(false);
- }
- yCoord.current = newCoord;
- };
-
const handleMobileMenuClick = () => setMobileMenuOpen(!mobileMenuOpen);
-
useEffect(() => {
+ const handleScroll = () => {
+ const newCoord = window.pageYOffset;
+ if (!mobileMenuOpen && newCoord > yCoord.current && newCoord > PREVENT_IS_HIDDEN_Y) {
+ setHidden(true);
+ } else {
+ setHidden(false);
+ }
+ yCoord.current = newCoord;
+ };
+
const func = throttle(handleScroll, 200);
// Prevents hide when clicking mobileMenuOpen
handleScroll();
window.addEventListener("scroll", func);
return () => window.removeEventListener("scroll", func);
- }, [isHidden, mobileMenuOpen]);
-
+ }, [mobileMenuOpen]);
return (
-
+
+))<{ $color?: typeof colors }>`
+ overflow: hidden;
+ font-size: 200px;
+ width: 1em;
+ height: 1em;
+
+ @keyframes rotation {
+ 0% { transform: rotate(0deg) }
+ 50% { transform: rotate(180deg) }
+ 100% { transform: rotate(360deg) }
+ }
+
+ & > div {
+ width: 100%;
+ height: 100%;
+ position: relative;
+ transform: translateZ(0) scale(1);
+ backface-visibility: hidden;
+ transform-origin: 0 0;
+
+ & > div {
+ box-sizing: content-box;
+ position: absolute;
+ animation: rotation 1s linear infinite;
+ width: 80%;
+ height: 80%;
+ top: 10%;
+ left: 10%;
+ border-radius: 50%;
+ box-shadow: 0 0.02em 0 0 ${({ $color }) => $color || colors.white};
+ transform-origin: 50% 51%;
+ }
+ }
+`;
+
+export default Loader;
diff --git a/src/components/NavbarChildLink.tsx b/src/components/NavbarChildLink.tsx
index 785b04e..ff894ea 100644
--- a/src/components/NavbarChildLink.tsx
+++ b/src/components/NavbarChildLink.tsx
@@ -1,34 +1,35 @@
import React from "react";
import styled from "styled-components";
-import Anchor from "./Anchor";
-import { colors } from "@theme/colors";
+import colors from "@theme/colors";
+import breakpoints from "@theme/breakpoints";
+import { Link } from "@components/index";
interface NavbarChildLinkProps {
to: string;
}
-const StyledLink = styled(Anchor)`
+const StyledLink = styled(Link)`
display: block;
padding: 1rem;
letter-spacing: 1.5px;
padding-right: 4rem;
font-weight: 400;
- @media screen and (max-width: 1200px) {
+ @media screen and (max-width: ${breakpoints.medium}) {
border-bottom: 1px dotted ${colors.lightBlue};
margin-left: 2rem;
padding-left: 0;
}
&:hover {
- @media screen and (min-width: 1200px) {
+ @media screen and (min-width: ${breakpoints.medium}) {
background-color: ${colors.lightBlue};
}
}
`;
const NavbarChildLink: React.FC
+
+
+ {children}
-{children}
{link && ( -{linkText}
-
{enumOptions.map((option, index) => {
const checked = value.indexOf(option.value) !== -1;
const itemDisabled =
- enumDisabled && enumDisabled.indexOf(option.value) != -1;
+ enumDisabled && enumDisabled.indexOf(option.value) !== -1;
const disabledCls =
disabled || itemDisabled || readonly ? "disabled" : "";
const checkbox = (
@@ -41,8 +43,8 @@ const Checkboxes: React.FC = ({id, disabled, options, value, au
checked={checked}
disabled={disabled || itemDisabled || readonly}
autoFocus={autofocus && index === 0}
- onChange={event => {
- const all = enumOptions.map(({ value }) => value);
+ onChange={(event) => {
+ const all = enumOptions.map(({ val }) => val);
if (event.target.checked) {
onChange(selectValue(option.value, value, all));
} else {
@@ -64,15 +66,14 @@ const Checkboxes: React.FC = ({id, disabled, options, value, au
);
})}
- )
-}
+ );
+};
Checkboxes.defaultProps = {
autofocus: false,
options: {
inline: false,
- }
-}
+ },
+};
-
-export default Checkboxes;
\ No newline at end of file
+export default Checkboxes;
diff --git a/src/components/Widgets/DatetimeWidget.tsx b/src/components/Widgets/DatetimeWidget.tsx
index 7bfb2a6..ecf9a2a 100644
--- a/src/components/Widgets/DatetimeWidget.tsx
+++ b/src/components/Widgets/DatetimeWidget.tsx
@@ -22,7 +22,9 @@ interface DatetimeWidgetProps {
disabled: boolean;
}
-const DatetimeWidget: React.FC
+
{label} {getIconByLabel(label)}
-
+
);
export default SectionDividerWidget;
diff --git a/src/components/Widgets/SectionDividerWidget/SectionDividerWidget.scss b/src/components/Widgets/SectionDividerWidget/SectionDividerWidget.scss
deleted file mode 100644
index ec018ab..0000000
--- a/src/components/Widgets/SectionDividerWidget/SectionDividerWidget.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-.section-divider-widget {
- display: flex;
- margin-top: 12px;
-
- > span.icon {
- margin-top: 4px;
- }
-}
diff --git a/src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx b/src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx
index 623311a..50fcaee 100644
--- a/src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx
+++ b/src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx
@@ -1,18 +1,20 @@
import React from "react";
-import { Question, InputProps, optionTypes, SignupQuestionError } from "./index";
+import {
+ Question, InputProps, optionTypes, SignupQuestionError,
+} from "./index";
import Checkbox from "@components/Widgets/Checkbox/Checkbox";
-export interface OptionsWidgetProps {
+interface OptionsWidgetProps {
inputProps: InputProps;
onChange: (value: Question[]) => void;
}
-export interface OptionsWidgetState { }
-class OptionsWidget extends React.Component
+ = ({ value, on
const onValueChange = (questions: Question[]) => {
const newValue = JSON.stringify(questions);
onChange(newValue);
- }
+ };
const handleNewRowClick = (questions) => () => {
const newRow: Question = {
@@ -48,7 +56,7 @@ const SignupQuestionsWidget: React.FC = ({ value, on
const newQuestions: Question[] = questions.concat([newRow]);
onValueChange(newQuestions);
- }
+ };
const handleDragEnd = (questions: Question[]) => (result) => {
const srcIndex = result.source.index;
@@ -58,7 +66,7 @@ const SignupQuestionsWidget: React.FC = ({ value, on
questions.splice(dstIndex, 0, srcCopy);
onValueChange(questions);
- }
+ };
const questions = JSON.parse(value) as Question[];
return (
@@ -74,15 +82,17 @@ const SignupQuestionsWidget: React.FC = ({ value, on
innerRef={provided.innerRef}
questions={questions}
onChange={onValueChange}
- placeholder={provided.placeholder} />
+ placeholder={provided.placeholder}
+ />
)}
-
+
+
);
-}
+};
export default SignupQuestionsWidget;
diff --git a/src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx b/src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx
index bea9a88..bba9aee 100644
--- a/src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx
+++ b/src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx
@@ -1,16 +1,16 @@
import React from "react";
import { Question, InputProps, optionTypes } from "./index";
-export interface TypeWidgetProps {
+interface TypeWidgetProps {
inputProps: InputProps;
onChange: (value: Question[]) => void;
}
-export interface TypeWidgetState { }
-class TypeWidget extends React.Component {
+class TypeWidget extends React.Component {
handleTypeChange = (questions: Question[], index: number) => (event) => {
const { onChange } = this.props;
const val = event.target.value;
+ // eslint-disable-next-line no-param-reassign
questions[index].type = val;
onChange(questions);
}
@@ -18,7 +18,7 @@ class TypeWidget extends React.Component {
render() {
const { inputProps } = this.props;
const { type, questions, index } = inputProps;
- const options = optionTypes.map(t => (
+ const options = optionTypes.map((t) => (
));
return (
diff --git a/src/components/Widgets/SignupQuestionsWidget/index.ts b/src/components/Widgets/SignupQuestionsWidget/index.ts
index daa90fc..87d807f 100644
--- a/src/components/Widgets/SignupQuestionsWidget/index.ts
+++ b/src/components/Widgets/SignupQuestionsWidget/index.ts
@@ -31,7 +31,7 @@ export const optionTypes = [
"radiobutton",
"checkbox",
"email",
- "name"
+ "name",
];
export class SignupQuestionError extends Error { }
diff --git a/src/components/index.tsx b/src/components/index.tsx
index befd1d7..66782fa 100644
--- a/src/components/index.tsx
+++ b/src/components/index.tsx
@@ -8,3 +8,4 @@ export { default as TextSection } from "./Sections/TextSection";
export { default as FullWidthSection } from "./Sections/FullWidthSection";
export { default as InfoBox } from "./InfoBox";
export { default as Accordion } from "./Accordion/Accordion";
+export { default as Link } from "./Link";
diff --git a/src/hooks/useFetchJobAd.ts b/src/hooks/useFetchJobAd.ts
deleted file mode 100644
index a5cb1bb..0000000
--- a/src/hooks/useFetchJobAd.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { useEffect, useState } from "react";
-import { JobAd, getJobAd } from "@models/JobAd";
-
-const useFetchJobAd = (id: number) => {
- const [jobAd, setJobAd] = useState(null);
-
- useEffect(() => {
- getJobAd(id)
- .then(res => setJobAd(res))
- }, []);
-
- return jobAd;
-}
-
-export default useFetchJobAd;
diff --git a/src/hooks/useFetchJobAds.ts b/src/hooks/useFetchJobAds.ts
deleted file mode 100644
index 6111add..0000000
--- a/src/hooks/useFetchJobAds.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { useEffect, useState } from "react";
-import { JobAd, getJobAds, GetJobAdsOptions } from "@models/JobAd";
-
-const useFetchJobAds = (options: GetJobAdsOptions = {}) => {
- const [jobAds, setJobAds] = useState([]);
-
- useEffect(() => {
- getJobAds(options)
- .then(res => setJobAds(res))
- }, []);
-
- return jobAds;
-}
-
-export default useFetchJobAds;
diff --git a/src/index.scss b/src/index.scss
deleted file mode 100644
index 2509fac..0000000
--- a/src/index.scss
+++ /dev/null
@@ -1,143 +0,0 @@
-@import "./assets/scss/normalize";
-@import "./assets/scss/globals";
-
-* {
- box-sizing: border-box;
-}
-
-html,
-body {
- font-size: 12pt;
- background-color: color(dark-blue);
- height: 100%;
- font-family: $font;
-}
-
-body {
- padding: 0;
- margin: auto !important;
-}
-
-#root {
- position: relative;
- min-height: 100vh;
- display: flex;
- flex-flow: column nowrap;
- color: color(black1);
- background-color: color(white1);
-}
-
-p {
- font-size: 1.2rem;
- font-weight: 300;
- word-break: break-word;
- hyphens: auto;
-
- &.large {
- font-size: 2rem;
- }
-
- @media screen and (max-width: 800px) {
- font-size: 1rem;
- }
-}
-
-h1 {
- font-size: 2.5rem;
- font-weight: 200;
- margin-block-start: 0;
- margin-block-end: 0;
-
- &.large {
- font-size: 2.75rem;
- }
-
- @media screen and (max-width: 800px) {
- font-size: 1.5rem;
- }
-}
-
-h2 {
- font-size: 1.2rem;
- font-weight: 700;
- letter-spacing: 0.1em;
- margin-block-start: 0;
- margin-block-end: 0;
- text-transform: uppercase;
-
- &.large {
- font-size: 2rem;
- }
-
- @media screen and (max-width: 800px) {
- font-size: 1rem;
- }
-}
-
-h3 {
- font-size: 1.5rem;
- font-weight: 200;
- margin-block-start: 0;
- margin-block-end: 0;
-
- &.large {
- font-size: 2rem;
- }
-}
-
-h4 {
- font-size: 1rem;
- font-weight: 700;
- letter-spacing: 0.1em;
- margin-block-start: 0;
- margin-block-end: 0;
- text-transform: uppercase;
-
- &.large {
- font-size: 2rem;
- }
-}
-
-h5 {
- font-size: 1.125rem;
- font-weight: 600;
- margin-block-start: 0;
- margin-block-end: 0;
-
- &.large {
- font-size: 2.3rem;
- }
-}
-
-h6 {
- font-size: 0.8rem;
- letter-spacing: 0.1em;
- font-weight: 800;
- margin-block-start: 0;
- margin-block-end: 0;
- text-transform: uppercase;
-
- &.large {
- font-size: 2rem;
- }
-}
-
-// TODO: List item style »
-li {
- font-size: 1.2rem;
- font-weight: 600;
-
- &.large {
- font-size: 2rem;
- }
-}
-
-
-a {
- text-decoration: underline;
- color: color(blue1);
-}
-
-a:hover {
- text-decoration: none;
-}
diff --git a/src/index.tsx b/src/index.tsx
deleted file mode 100644
index 2778e0e..0000000
--- a/src/index.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from "react";
-import { render } from "react-dom";
-import { BrowserRouter } from "react-router-dom";
-import { AppContainer } from "react-hot-loader";
-import Routes from "./routes";
-import "./index.scss";
-
-console.log("Using API URL: ", process.env.API_URL);
-
-const rootEl = document.getElementById("root");
-
-render(
-
-
-
- ,
- rootEl
-);
-
-// Hot Module Replacement API
-declare const module: { hot: any };
-
-if (module.hot) {
- module.hot.accept("./routes", () => {
- // eslint-disable-next-line @typescript-eslint/no-var-requires
- const NewRoutes = require("./routes").default;
-
- render(
-
-
-
- ,
- rootEl
- );
- });
-}
diff --git a/src/models/Contacts.ts b/src/models/Contacts.ts
deleted file mode 100644
index 93d1840..0000000
--- a/src/models/Contacts.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import axios from "axios";
-
-const url = `${process.env.API_URL}/contacts`;
-const committeeUrl = `${process.env.API_URL}/committees`;
-
-export interface Committee {
- name_fi: string;
- name_en: string;
-}
-
-export interface Role {
- name_fi: string;
- name_en: string;
- description_fi: string;
- description_en: string;
- committee: Committee;
- is_board: boolean;
-}
-
-export interface Contact {
- first_name: string;
- last_name: string;
- phone_number: number;
- email: string;
- image: string;
-}
-
-export interface Occupation {
- role: Role;
- start_date: string;
- end_date: string;
- officials: Contact[];
-}
-
-export async function getContacts(year: number = new Date().getFullYear()): Promise {
- try {
- const resp = await axios.get(`${url}?year=${year}`);
- return resp.data["results"];
- } catch (err) {
- console.error(err);
- throw err;
- }
-}
-
-export async function getCommittees(): Promise {
- try {
- const resp = await axios.get(`${committeeUrl}`);
- return resp.data["results"];
- } catch (err) {
- console.error(err);
- throw err;
- }
-}
diff --git a/src/models/Event.ts b/src/models/Event.ts
index a29c236..7476b3d 100644
--- a/src/models/Event.ts
+++ b/src/models/Event.ts
@@ -1,9 +1,11 @@
-import axios from "axios";
+import axios, { AxiosRequestConfig } from "axios";
+import useSWR from "swr";
+import qs from "query-string";
import { getAuthHeader } from "@utils/auth";
import { Tag } from "./Tag";
-import qs from "query-string";
import { SignupForm } from "./SignupForm";
-const url = `${process.env.API_URL}/events/`;
+
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/events/`;
export interface Event {
id: number;
@@ -37,11 +39,11 @@ export async function getEvents(options: Options = {}): Promise {
limit,
};
const search = qs.stringify(params);
- const headers = auth ? { "Authorization": getAuthHeader() } : null;
- const resp = await axios.get(`${url}?${search}`, {
- headers
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
+ const resp = await axios.get(`${URL}?${search}`, {
+ headers,
});
- return resp.data["results"];
+ return resp.data.results;
} catch (err) {
console.error(err);
throw err;
@@ -50,9 +52,9 @@ export async function getEvents(options: Options = {}): Promise {
export async function getEvent(id: number, auth = false): Promise {
try {
- const headers = auth ? { "Authorization": getAuthHeader() } : null;
- const resp = await axios.get(`${url}${id}/`, {
- headers
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
+ const resp = await axios.get(`${URL}${id}/`, {
+ headers,
});
return resp.data;
} catch (err) {
@@ -63,9 +65,9 @@ export async function getEvent(id: number, auth = false): Promise {
export async function createEvent(data): Promise {
try {
- const resp = await axios.post(url, data, {
+ const resp = await axios.post(URL, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -77,10 +79,10 @@ export async function createEvent(data): Promise {
export async function updateEvent(data): Promise {
try {
- const putUrl = `${url}${data.id}/`;
+ const putUrl = `${URL}${data.id}/`;
const resp = await axios.put(putUrl, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -89,3 +91,54 @@ export async function updateEvent(data): Promise {
throw err;
}
}
+
+export async function deleteEvent(id: number) {
+ try {
+ const resp = await axios.delete(`${URL}${id}`, {
+ headers: {
+ Authorization: getAuthHeader(),
+ },
+ });
+ return resp.data;
+ } catch (err) {
+ console.error(err);
+ throw err;
+ }
+}
+
+export const eventFetcher = (url: string, config?: AxiosRequestConfig) => axios.get(url, config).then((res) => res.data);
+
+export const generateFetchParams = (id = "", options: Options = {}) => {
+ const url = `${URL}${id}`;
+ const { auth, onlyNonPast, limit } = options;
+
+ return {
+ url,
+ config: {
+ params: {
+ since: onlyNonPast ? (new Date()).toISOString() : undefined,
+ limit,
+ },
+ headers: auth ? { Authorization: getAuthHeader() } : null,
+ },
+ };
+};
+
+interface FetchArguments {
+ initialData?: Event | Event[],
+ id?: string;
+ options?: Options
+}
+
+export const useFetchEvents = ({
+ initialData,
+ id = "",
+ options = {},
+}: FetchArguments) => {
+ const { url, config } = generateFetchParams(id, options);
+ const { data, error } = useSWR([url, config], eventFetcher, { initialData });
+ return {
+ data: data?.results || data,
+ error,
+ };
+};
diff --git a/src/models/Feed.ts b/src/models/Feed.ts
index cd33b38..6da243f 100644
--- a/src/models/Feed.ts
+++ b/src/models/Feed.ts
@@ -1,8 +1,9 @@
-import axios from "axios";
+import axios, { AxiosRequestConfig } from "axios";
+import useSWR from "swr";
import { getAuthHeader } from "@utils/auth";
import { Tag } from "./Tag";
-const url = `${process.env.API_URL}/feed/`;
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/feed/`;
export interface Post {
id: number;
@@ -26,19 +27,21 @@ interface Options {
export async function getFeed(options: Options = {}): Promise {
const { auth } = options;
- const headers = auth ? { "Authorization": getAuthHeader() } : null;
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
try {
- const resp = await axios.get(url, { headers });
- return resp.data["results"];
+ const resp = await axios.get(URL, { headers });
+ return resp.data.results;
} catch (err) {
console.error(err);
throw err;
}
}
-export async function getPost(id: number): Promise {
+export async function getPost(id: number, options: Options = {}): Promise {
+ const { auth } = options;
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
try {
- const resp = await axios.get(`${url}${id}/`);
+ const resp = await axios.get(`${URL}${id}/`, { headers });
return resp.data;
} catch (err) {
console.error(err);
@@ -48,9 +51,9 @@ export async function getPost(id: number): Promise {
export async function createPost(data): Promise {
try {
- const resp = await axios.post(url, data, {
+ const resp = await axios.post(URL, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -62,10 +65,10 @@ export async function createPost(data): Promise {
export async function updatePost(data): Promise {
try {
- const putUrl = `${url}${data.id}/`;
+ const putUrl = `${URL}${data.id}/`;
const resp = await axios.put(putUrl, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -74,3 +77,36 @@ export async function updatePost(data): Promise {
throw err;
}
}
+
+export const feedFetcher = (url: string, config?: AxiosRequestConfig) => axios.get(url, config).then((res) => res.data);
+
+export const generateFetchParams = (id = "", options: Options = {}) => {
+ const url = `${URL}${id}`;
+ const { auth } = options;
+
+ return {
+ url,
+ config: {
+ headers: auth ? { Authorization: getAuthHeader() } : null,
+ },
+ };
+};
+
+interface FetchArguments {
+ initialData?: Post | Post[],
+ id?: string;
+ options?: Options
+}
+
+export const useFetchFeed = ({
+ initialData,
+ id = "",
+ options = {},
+}: FetchArguments) => {
+ const { url, config } = generateFetchParams(id, options);
+ const { data, error } = useSWR([url, config], feedFetcher, { initialData });
+ return {
+ data: data?.results || data,
+ error,
+ };
+};
diff --git a/src/models/JobAd.ts b/src/models/JobAd.ts
index 784e6e9..39ada99 100644
--- a/src/models/JobAd.ts
+++ b/src/models/JobAd.ts
@@ -1,7 +1,9 @@
-import axios from "axios";
+import axios, { AxiosRequestConfig } from "axios";
+import useSWR from "swr";
import qs from "query-string";
import { getAuthHeader } from "@utils/auth";
-const url = `${process.env.API_URL}/jobads/`;
+
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/jobads/`;
export interface JobAd {
id: number;
@@ -29,35 +31,35 @@ export const getJobAds = async (options: GetJobAdsOptions = {}): Promise => {
+export const getJobAd = async (id: number, auth = false): Promise => {
try {
- const headers = auth ? { "Authorization": getAuthHeader() } : null;
- const resp = await axios.get(`${url}${id}/`, {
- headers
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
+ const resp = await axios.get(`${URL}${id}/`, {
+ headers,
});
return resp.data;
} catch (err) {
console.error(err);
throw err;
}
-}
+};
export const createJobAd = async (data: any): Promise => {
try {
- const resp = await axios.post(url, data, {
+ const resp = await axios.post(URL, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -65,14 +67,14 @@ export const createJobAd = async (data: any): Promise => {
console.error(err);
throw err;
}
-}
+};
export const updateJobAd = async (data: any): Promise => {
try {
- const putUrl = `${url}${data.id}/`;
+ const putUrl = `${URL}${data.id}/`;
const resp = await axios.put(putUrl, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -80,4 +82,41 @@ export const updateJobAd = async (data: any): Promise => {
console.error(err);
throw err;
}
-}
\ No newline at end of file
+};
+
+export const jobAdFetcher = (url: string, config?: AxiosRequestConfig) => axios.get(url, config).then((res) => res.data);
+
+export const generateFetchParams = (id = "", options: Options = {}) => {
+ const url = `${URL}${id}`;
+ const { auth } = options;
+
+ return {
+ url,
+ config: {
+ headers: auth ? { Authorization: getAuthHeader() } : null,
+ },
+ };
+};
+
+interface Options {
+ auth?: boolean;
+}
+
+interface FetchArguments {
+ initialData?: JobAd | JobAd[],
+ id?: string;
+ options?: Options;
+}
+
+export const useFetchJobAds = ({
+ initialData,
+ id = "",
+ options = {},
+}: FetchArguments) => {
+ const { url, config } = generateFetchParams(id, options);
+ const { data, error } = useSWR([url, config], jobAdFetcher, { initialData });
+ return {
+ data: data?.results || data,
+ error,
+ };
+};
diff --git a/src/models/Signup.ts b/src/models/Signup.ts
index d788e8f..7c4626c 100644
--- a/src/models/Signup.ts
+++ b/src/models/Signup.ts
@@ -1,6 +1,7 @@
import axios from "axios";
import { getAuthHeader } from "@utils/auth";
-const url = `${process.env.API_URL}/signup/`;
+
+const url = `${process.env.NEXT_PUBLIC_API_URL}/signup/`;
export interface Signup {
id?: number;
@@ -12,7 +13,7 @@ export const getSignup = async (id: number): Promise => {
try {
const resp = await axios.get(`${url}${id}`, {
headers: {
- "Authorization": getAuthHeader()
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -20,7 +21,7 @@ export const getSignup = async (id: number): Promise => {
console.error(err);
throw err;
}
-}
+};
export const createSignup = async (data: Signup): Promise => {
try {
@@ -30,41 +31,27 @@ export const createSignup = async (data: Signup): Promise => {
console.error(err);
throw err;
}
-}
+};
export const updateSignup = async (data: Signup, uuid: string): Promise => {
try {
const { id } = data;
if (!id) throw new Error("SignupId required!");
const resp = await axios.put(`${url}${id}/edit/`, data, {
- params: { uuid }
+ params: { uuid },
});
return resp.data;
} catch (err) {
console.error(err);
throw err;
}
-}
+};
export const getSignupUUID = async (id: number, uuid: string): Promise => {
try {
const resp = await axios.get(`${url}${id}/edit/`, {
params: {
- uuid
- }
- });
- return resp.data;
- } catch (err) {
- console.error(err);
- throw err;
- }
-}
-
-export const deleteSignup = async (id: number): Promise => {
- try {
- const resp = await axios.delete(`${url}${id}`, {
- headers: {
- "Authorization": getAuthHeader()
+ uuid,
},
});
return resp.data;
@@ -72,4 +59,18 @@ export const deleteSignup = async (id: number): Promise => {
console.error(err);
throw err;
}
-}
+};
+
+export const deleteSignup = async (id: number) => {
+ try {
+ const resp = await axios.delete(`${url}${id}`, {
+ headers: {
+ Authorization: getAuthHeader(),
+ },
+ });
+ return resp.data;
+ } catch (err) {
+ console.error(err);
+ throw err;
+ }
+};
diff --git a/src/models/SignupForm.ts b/src/models/SignupForm.ts
index b17f737..b3f4c07 100644
--- a/src/models/SignupForm.ts
+++ b/src/models/SignupForm.ts
@@ -1,9 +1,10 @@
import axios from "axios";
import { getAuthHeader } from "@utils/auth";
-const url = `${process.env.API_URL}/signupForm/`;
import { Question } from "@components/Widgets/SignupQuestionsWidget";
import { Signup } from "./Signup";
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/signupForm/`;
+
export interface SignupForm {
id?: number;
title_fi: string;
@@ -25,9 +26,9 @@ export interface SignupForm {
export async function getForms(auth = false): Promise {
try {
- const headers = auth ? { "Authorization": getAuthHeader() } : null;
- const resp = await axios.get(url, {
- headers
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
+ const resp = await axios.get(URL, {
+ headers,
});
const { results } = resp.data;
return results;
@@ -39,9 +40,9 @@ export async function getForms(auth = false): Promise {
export async function getForm(id: number, auth = false): Promise {
try {
- const headers = auth ? { "Authorization": getAuthHeader() } : null;
- const resp = await axios.get(`${url}${id}/`, {
- headers
+ const headers = auth ? { Authorization: getAuthHeader() } : null;
+ const resp = await axios.get(`${URL}${id}/`, {
+ headers,
});
return resp.data;
} catch (err) {
@@ -52,9 +53,9 @@ export async function getForm(id: number, auth = false): Promise {
export async function createForm(data): Promise {
try {
- const resp = await axios.post(url, data, {
+ const resp = await axios.post(URL, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -66,10 +67,24 @@ export async function createForm(data): Promise {
export async function updateForm(data): Promise {
try {
- const putUrl = `${url}${data.id}/`;
+ const putUrl = `${URL}${data.id}/`;
const resp = await axios.put(putUrl, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
+ },
+ });
+ return resp.data;
+ } catch (err) {
+ console.error(err);
+ throw err;
+ }
+}
+
+export async function deleteForm(id: number) {
+ try {
+ const resp = await axios.delete(`${URL}${id}`, {
+ headers: {
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -81,9 +96,9 @@ export async function updateForm(data): Promise {
export const signupFormSendEmail = async (data, id): Promise => {
try {
- const resp = await axios.post(`${process.env.API_URL}/signupForm/${id}/sendemail/`, data, {
+ const resp = await axios.post(`${URL}${id}/sendemail/`, data, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -91,13 +106,13 @@ export const signupFormSendEmail = async (data, id): Promise => {
console.error(err);
throw err;
}
-}
+};
export const getSignups = async (id): Promise => {
try {
- const resp = await axios.get(`${process.env.API_URL}/signupForm/${id}/signups/`, {
+ const resp = await axios.get(`${URL}${id}/signups/`, {
headers: {
- "Authorization": getAuthHeader(),
+ Authorization: getAuthHeader(),
},
});
return resp.data;
@@ -105,4 +120,4 @@ export const getSignups = async (id): Promise => {
console.error(err);
throw err;
}
-}
+};
diff --git a/src/models/Tag.ts b/src/models/Tag.ts
index c5159f5..6a4ef37 100644
--- a/src/models/Tag.ts
+++ b/src/models/Tag.ts
@@ -1,6 +1,6 @@
import axios from "axios";
-const url = `${process.env.API_URL}/tags/`;
+const url = `${process.env.NEXT_PUBLIC_API_URL}/tags/`;
export interface Tag {
id: number;
@@ -13,7 +13,7 @@ export interface Tag {
export async function getTags(): Promise {
try {
const resp = await axios.get(url);
- return resp.data["results"];
+ return resp.data.results;
} catch (err) {
console.error(err);
throw err;
diff --git a/src/pages/NotFoundPage.tsx b/src/pages/404.tsx
similarity index 76%
rename from src/pages/NotFoundPage.tsx
rename to src/pages/404.tsx
index ab08ac7..383273f 100644
--- a/src/pages/NotFoundPage.tsx
+++ b/src/pages/404.tsx
@@ -1,8 +1,9 @@
import React from "react";
-import { Helmet } from "react-helmet";
+import { NextPage } from "next";
+import Head from "next/head";
import styled from "styled-components";
-const NotFound = styled.div`
+const NotFound = styled.main`
text-align: center;
font-size: 4rem;
font-weight: 200;
@@ -12,13 +13,13 @@ const NotFound = styled.div`
width: 100%;
`;
-const NotFoundPage: React.FC = () => (
+const NotFoundPage: NextPage = () => (
<>
-
+
404 | Ei vaan löydy
-
+
404 | Ei vaan löydy
diff --git a/src/pages/ActualPage.tsx b/src/pages/ActualPage.tsx
deleted file mode 100644
index 009a287..0000000
--- a/src/pages/ActualPage.tsx
+++ /dev/null
@@ -1,89 +0,0 @@
-import React from "react";
-import { Helmet } from "react-helmet";
-import { StaticContext } from "@server/StaticContext";
-import ActualPageView from "@views/ActualPage/ActualPageView";
-import { Event, getEvents } from "@models/Event";
-import { Post, getFeed } from "@models/Feed";
-
-interface ActualPageProps {
- staticContext: StaticContext;
-}
-
-interface ActualPageState {
- events: Event[];
- feed: Post[];
-}
-
-
-class ActualPage extends React.Component {
- constructor(props: ActualPageProps) {
- super(props);
- const { staticContext } = props;
-
- if (staticContext) {
- /* The static context is an object that manages promises when
- rendering on the server. If staticContext exists, that means
- we have to store all promises in it. Otherwise, operate
- normally. See server/index.ts. */
- if (staticContext.resolutions.getEvents) {
- const events = staticContext.resolutions.getEvents as Event[];
- const feed = staticContext.resolutions.getFeed as Post[];
- this.state = {
- events,
- feed,
- };
- } else {
- this.state = {
- events: [],
- feed: [],
- };
- const promiseEvents = this.fetchEvents();
- const promiseFeed = this.fetchFeed();
- staticContext.promises.getEvents = promiseEvents;
- staticContext.promises.getFeed = promiseFeed;
- }
- } else {
- this.state = {
- events: [],
- feed: [],
- };
- this.fetchEvents();
- this.fetchFeed();
- }
- }
-
- fetchEvents = () => {
- const getEventsPromise = getEvents({
- onlyNonPast: true,
- });
- getEventsPromise.then(events => {
- this.setState({
- events,
- });
- });
- return getEventsPromise;
- }
-
- fetchFeed = () => {
- const getFeedPromise = getFeed();
- getFeedPromise.then(feed => {
- this.setState({
- feed,
- });
- });
- return getFeedPromise;
- }
-
- render() {
- return (
- <>
-
-
-
- {
- render() {
- const Page = this.props.page;
- return (
- <>
- {
- constructor(props: ContactsPageProps) {
- super(props);
- const { staticContext } = props;
-
- if (staticContext) {
- /* The static context is an object that manages promises when
- rendering on the server. If staticContext exists, that means
- we have to store all promises in it. Otherwise, operate
- normally. See server/index.ts. */
- if (staticContext.resolutions.getContacts) {
- const contacts = staticContext.resolutions.getContacts as Occupation[];
- const committees = staticContext.resolutions.getCommittees as Committee[];
- this.state = {
- contacts,
- committees,
- };
- } else {
- this.state = {
- contacts: [],
- committees: [],
- };
- const promiseContacts = this.fetchContacts();
- const promiseCommittees = this.fetchCommittees();
- staticContext.promises.getContacts = promiseContacts;
- staticContext.promises.getCommittees = promiseCommittees;
- }
- } else {
- this.state = {
- contacts: [],
- committees: [],
- };
- this.fetchContacts();
- this.fetchCommittees();
- }
- }
-
- fetchContacts = () => {
- const getContactsPromise = getContacts();
- getContactsPromise.then(contacts => {
- this.setState({
- contacts,
- });
- });
- return getContactsPromise;
- }
-
- fetchCommittees = () => {
- const getCommitteesPromise = getCommittees();
- getCommitteesPromise.then(committees => {
- this.setState({
- committees,
- });
- });
- return getCommitteesPromise;
- }
-
- render() {
- const { contacts, committees } = this.state;
- return (
- <>
-
-
-
-
-
-
-
-
-class EventPage extends React.Component {
- constructor(props: EventPageProps) {
- super(props);
- const { id } = this.props.match.params;
- this.state = {
- event: null
- }
- this.fetchEvent(Number(id));
- }
-
-
- fetchEvent(id: number) {
- const eventPromise = getEvent(id);
- eventPromise.then(event => {
- this.setState({
- event,
- });
- });
- return eventPromise;
- }
-
- render() {
- const { event } = this.state;
- if (!event) return
-
-
-
-
-
- {
- constructor(props: FrontPageProps) {
- super(props);
- const { staticContext } = props;
-
- if (staticContext) {
- /* The static context is an object that manages promises when
- rendering on the server. If staticContext exists, that means
- we have to store all promises in it. Otherwise, operate
- normally. See server/index.ts. */
- if (staticContext.resolutions.getEvents) {
- const events = staticContext.resolutions.getEvents as Event[];
- const feed = staticContext.resolutions.getFeed as Post[];
- this.state = {
- events,
- feed,
- };
- } else {
- this.state = {
- events: [],
- feed: [],
- };
- const promiseEvents = this.fetchEvents();
- const promiseFeed = this.fetchFeed();
- staticContext.promises.getEvents = promiseEvents;
- staticContext.promises.getFeed = promiseFeed;
- }
- } else {
- this.state = {
- events: [],
- feed: [],
- };
- this.fetchEvents();
- this.fetchFeed();
- }
- }
-
- fetchEvents = () => {
- const getEventsPromise = getEvents({
- onlyNonPast: true,
- limit: 4,
- });
- getEventsPromise.then(events => {
- this.setState({
- events,
- });
- });
- return getEventsPromise;
- }
-
- fetchFeed = () => {
- const getFeedPromise = getFeed();
- getFeedPromise.then(feed => {
- this.setState({
- feed,
- });
- });
- return getFeedPromise;
- }
-
- render() {
- const { events, feed } = this.state;
- return (
- <>
-
-
-
- ;
-
-interface SignUpPageState {
- signUpForm?: SignupForm;
- formData: any;
- statusMessage?: string;
- error?: string;
-}
-
-class SignUpPage extends React.Component {
- constructor(props: SignUpPageProps) {
- super(props);
- this.state = {
- signUpForm: null,
- formData: {},
- statusMessage: null,
- error: null,
- };
- const { match } = this.props;
- const { formId, signupId } = match.params;
- if (signupId) {
- this.fetchSignUp().then(s => this.fetchSignUpForm(s.signupForm_id))
- } else {
- this.fetchSignUpForm(Number(formId));
- }
- }
-
- fetchSignUpForm = (formId: number): Promise => {
- const formPromise = getForm(formId);
- formPromise.then(signUpForm => {
- this.setState({
- signUpForm,
- });
- });
- return formPromise;
- }
-
- fetchSignUp = (): Promise => {
- const { match } = this.props;
- const { signupId, uuid } = match.params;
- const signupPromise = getSignupUUID(Number(signupId), uuid);
- signupPromise.then(signup => this.setState({
- formData: signup.answer
- }))
- return signupPromise;
- }
-
- onSubmit = async (data) => {
- const { signUpForm } = this.state;
- const { signupId, uuid } = this.props.match.params;
- const payload: Signup = {
- id: signupId ? Number(signupId): undefined,
- signupForm_id: signUpForm.id,
- answer: data.formData,
- };
-
- try {
- if (uuid) {
- const resp = await updateSignup(payload, uuid);
- this.fetchSignUpForm(signUpForm.id);
- this.setState({
- formData: resp,
- statusMessage: "Sign-up submission updated successfully.",
- });
- }
- else {
- const resp = await createSignup(payload);
- this.fetchSignUpForm(signUpForm.id);
- this.setState({
- error: null,
- statusMessage: "Sign-up submitted successfully",
- });
- }
- } catch (error) {
- console.error(error);
- this.setState({
- error,
- statusMessage: "Bad request"
- });
- }
- }
-
- onChange = (data) => {
- console.log(data);
- }
-
- render() {
- const { match } = this.props;
- const { formId } = match.params;
- const { signUpForm, formData, statusMessage } = this.state;
-
- return (
- <>
-
-
-
-
-
-
- SIK100 */}
+ {/* */}
+ {/* */}
+ {/* */}
+
+
+
+
+);
+
+// Only uncomment this method if you have blocking data requirements for
+// every single page in your application. This disables the ability to
+// perform automatic static optimization, causing every page in your app to
+// be server-side rendered.
+//
+// export const getInitialProps = async (appContext: AppContext) => {
+// // calls page's `getInitialProps` and fills `appProps.pageProps`
+// const appProps = await App.getInitialProps(appContext);
+// return { ...appProps }
+// }
+
+export default Web20App;
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
new file mode 100644
index 0000000..dc3ef7f
--- /dev/null
+++ b/src/pages/_document.tsx
@@ -0,0 +1,49 @@
+import React from "react";
+import Document, {
+ Html, Head, Main, NextScript, DocumentContext,
+} from "next/document";
+import { ServerStyleSheet } from "styled-components";
+import Favicons from "@components/Favicons";
+import HTMLLogo from "@components/HTMLLogo";
+
+export default class MyDocument extends Document {
+ static async getInitialProps(ctx: DocumentContext) {
+ const sheet = new ServerStyleSheet();
+ const originalRenderPage = ctx.renderPage;
+ try {
+ ctx.renderPage = () => originalRenderPage({
+ enhanceApp: (App) => (props) => sheet.collectStyles( {
- unmounted: boolean;
-
- constructor(props) {
- super(props);
- this.state = {
- redirecting: false,
- };
-
- if (props.requireAuthentication) {
- this.updateIsAuthenticated();
- }
- }
-
- componentWillUnmount() {
- this.unmounted = true;
- }
-
- updateIsAuthenticated = async () => {
- const redirecting = !await isAuthenticated();
- if (!this.unmounted && redirecting) {
- this.setState({
- redirecting,
- });
- }
- }
-
- render() {
- const Page = this.props.page;
- const { path } = this.props.match;
- const { redirecting } = this.state;
-
- if (redirecting) {
- const loginURL = `/admin/login?next=${path}`;
- return
-
-
- );
- }
-}
-
-export default AdminCommonPage;
diff --git a/src/pages/admin/AdminFrontView.tsx b/src/pages/admin/AdminFrontView.tsx
deleted file mode 100644
index 179d9b8..0000000
--- a/src/pages/admin/AdminFrontView.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import React from "react";
-import { Helmet } from "react-helmet";
-
-const AdminFrontView: React.FC = () => (
-
-
-
-
-
-);
-
-export default AdminFrontView;
diff --git a/src/pages/admin/AdminJobAdPage.tsx b/src/pages/admin/AdminJobAdPage.tsx
deleted file mode 100644
index 723daed..0000000
--- a/src/pages/admin/AdminJobAdPage.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React from "react";
-import { Helmet } from "react-helmet";
-import { formatRelative } from "date-fns";
-import AdminListCommon from "@views/admin/AdminListCommon";
-import Anchor from "@components/Anchor";
-import AddLink from "@components/AddLink";
-import useFetchJobAds from "@hooks/useFetchJobAds";
-import { JobAd } from "@models/JobAd";
-
-const URL = "/admin/jobads"
-
-const renderData = (jobAds: JobAd[]) => {
-
- if (!jobAds || jobAds.length === 0) {
- return
-
-
- );
-}
-
-const AdminJobAdPage: React.FC = () => {
- const jobAds = useFetchJobAds({ auth: true });
- return (
-
-
-
-
-
- )
-}
-
-export default AdminJobAdPage;
\ No newline at end of file
diff --git a/src/pages/admin/AdminLoginPage.tsx b/src/pages/admin/AdminLoginPage.tsx
deleted file mode 100644
index 3121a16..0000000
--- a/src/pages/admin/AdminLoginPage.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-import React from "react";
-import styled from "styled-components";
-import { Helmet } from "react-helmet";
-import { Redirect } from "react-router-dom";
-import qs from "query-string";
-import { generateToken, setTokenCookie, isAuthenticated } from "@utils/auth";
-
-const Main = styled.div`
- input {
- display: block;
- }
-`;
-
-interface AdminLoginPageProps {
- history: {
- push: (to: string | string[]) => void;
- };
- location: {
- search: string;
- };
-}
-interface AdminLoginPageState {
- username: string;
- password: string;
- isAuthenticated: boolean;
- error: string;
-}
-
-const DEFAULT_REDIRECT = "/admin";
-class AdminLoginPage extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- username: "",
- password: "",
- isAuthenticated: false,
- error: "",
- };
-
- this.handleUserAuthenticated();
- }
-
- handleUserAuthenticated = async () => {
- const authenticated = await isAuthenticated();
- if (authenticated) {
- this.setState({
- isAuthenticated: true,
- });
- }
- }
-
- handleSubmit = async (e) => {
- e.preventDefault();
- const { username, password } = this.state;
- const { history } = this.props;
-
- try {
- const token = await generateToken(username, password);
- console.log("JWT token:", token);
- setTokenCookie(token);
-
- const next = this.getRedirectURL();
- history.push(next);
- } catch (err) {
- this.setState({
- error: "Failed to log in!",
- });
- console.error("Failed to log in!");
- }
- }
-
- handleUserNameChange = (e) => {
- this.setState({
- username: e.target.value,
- });
- }
-
- handlePasswordChange = (e) => {
- this.setState({
- password: e.target.value,
- });
- }
-
- renderError = () => {
- const { error } = this.state;
- if (!error) return null;
-
- return (
-
-
-
-
-
- );
- }
-}
-
-export default AdminLoginPage;
diff --git a/src/pages/admin/AdminLogoutPage.tsx b/src/pages/admin/AdminLogoutPage.tsx
deleted file mode 100644
index 4a4d72c..0000000
--- a/src/pages/admin/AdminLogoutPage.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from "react";
-import { Redirect } from "react-router-dom";
-import { deleteTokenCookie } from "@utils/auth";
-
-export interface AdminLogoutPageProps {}
-export interface AdminLogoutPageState {}
-
-class AdminLogoutPage extends React.Component {
- constructor(props) {
- super(props);
- deleteTokenCookie();
- }
-
- render() {
- return (
- ;
-
-
-const SignupEmailPage: React.FC = ({ match: { params: { id } } }) => {
- const [signupForm, setSignupForm] = useState(null);
- useEffect(() => {
- const formId = Number(id);
- if (formId !== undefined) {
- getForm(formId, true)
- .then(res => setSignupForm(res))
- }
- }, [id])
-
-
-
- const [error, setError] = useState(null);
- const [statusMessage, setStatusMessage] = useState(null);
-
- const onSubmit = async (data) => {
- try {
- const payload = data.formData;
- await signupFormSendEmail(payload, id);
- setStatusMessage("Email sent successfully");
- } catch (err) {
- setError(err);
- }
- }
-
- // const onChange = (data) => setFormData(data.formData);
- const onFocus = () => setStatusMessage(null);
-
- const title = signupForm ? signupForm.title_fi : "Loading..."
-
- return (
- <>
-
-
-
- ;
-
-const EventCreatePage: React.FC = ({ match: { params: { id } } }) => {
+const EventCreatePage: NextPage = () => {
const [formData, setFormData] = useState(null);
const [tags, setTags] = useState([]);
const [signupForms, setSignupForms] = useState([]);
const [error, setError] = useState(null);
const [statusMessage, setStatusMessage] = useState(null);
- useEffect(() => {
+ const router = useRouter();
+ let id: string;
+
+ if (router.query?.id && router.query.id !== "create") {
+ id = router.query.id as string;
+ }
+
+ useEffect(() => {
getTags()
- .then(res => setTags(res))
- .catch(err => setError(err))
+ .then((res) => setTags(res))
+ .catch((err) => setError(err));
getForms(true)
- .then(res => setSignupForms(res))
- .catch(err => setError(err))
+ .then((res) => setSignupForms(res))
+ .catch((err) => setError(err));
const eventId = id && Number(id);
if (eventId !== undefined) {
getEvent(eventId, true)
- .then(res => setFormData({
+ .then((res) => setFormData({
...res,
- tags: (res.tags).map(inst => inst.id) as any,
- signupForm: (res.signupForm).map(inst => inst.id) as any,
+ tags: (res.tags).map((inst) => inst.id) as any,
+ signupForm: (res.signupForm).map((inst) => inst.id) as any,
}))
- .catch(err => setError(err))
+ .catch((err) => setError(err));
}
- }, [id])
+ }, [id]);
const onSubmit = async (data) => {
try {
@@ -224,7 +228,7 @@ const EventCreatePage: React.FC = ({ match: { params: { id
} catch (err) {
setError(err);
}
- }
+ };
const onChange = (data) => setFormData(data.formData);
const onFocus = () => setStatusMessage(null);
@@ -234,9 +238,9 @@ const EventCreatePage: React.FC = ({ match: { params: { id
return (
<>
-
+
-
+
= ({ match: { params: { id
/>
);
-}
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default EventCreatePage;
diff --git a/src/pages/admin/AdminEventPage.tsx b/src/pages/admin/events/index.tsx
similarity index 60%
rename from src/pages/admin/AdminEventPage.tsx
rename to src/pages/admin/events/index.tsx
index 34e448d..8c4a793 100644
--- a/src/pages/admin/AdminEventPage.tsx
+++ b/src/pages/admin/events/index.tsx
@@ -1,12 +1,13 @@
import React, { useEffect, useState } from "react";
-import { Helmet } from "react-helmet";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
import { formatRelative } from "date-fns";
import AdminListCommon from "@views/admin/AdminListCommon";
-import Anchor from "@components/Anchor";
+import { Link } from "@components/index";
import AddLink from "@components/AddLink";
import { Event, getEvents } from "@models/Event";
-const URL = "/admin/events"
+const URL = "/admin/events";
const renderData = (events: Event[]) => {
if (!events || events.length === 0) {
@@ -23,9 +24,9 @@ const renderData = (events: Event[]) => {
- {events.map(event => (
+ {events.map((event) => (
- {event.title_fi} {event.title_fi}
{formatRelative(new Date(event.start_time), new Date())}
{formatRelative(new Date(event.end_time), new Date())}
@@ -33,25 +34,29 @@ const renderData = (events: Event[]) => {
);
-}
-const AdminEventPage: React.FC = () => {
+};
+const AdminEventPage: NextPage = () => {
const [events, setEvents] = useState(null);
useEffect(() => {
getEvents({ auth: true })
- .then(res => setEvents(res))
+ .then((res) => setEvents(res));
}, []);
return (
-
-
+ <>
+
-
-
+
+
+
+
);
-}
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default AdminEventPage;
diff --git a/src/pages/admin/FeedCreatePage.tsx b/src/pages/admin/feed/[id].tsx
similarity index 81%
rename from src/pages/admin/FeedCreatePage.tsx
rename to src/pages/admin/feed/[id].tsx
index 028e7e5..4efdddb 100644
--- a/src/pages/admin/FeedCreatePage.tsx
+++ b/src/pages/admin/feed/[id].tsx
@@ -1,17 +1,20 @@
import React, { useEffect, useState } from "react";
-import { Helmet } from "react-helmet";
-import { RouteComponentProps } from "react-router-dom";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { useRouter } from "next/router";
import AdminCreateCommon from "@views/admin/AdminCreateCommon";
import { Tag, getTags } from "@models/Tag";
-import { Post, createPost, getPost, updatePost } from "@models/Feed";
+import {
+ Post, createPost, getPost, updatePost,
+} from "@models/Feed";
import DatetimeWidget from "@components/Widgets/DatetimeWidget";
-import SectionDividerWidget from "@components/Widgets/SectionDividerWidget/SectionDividerWidget";
+import SectionDividerWidget from "@components/Widgets/SectionDividerWidget";
import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
const widgets = {
datetime: DatetimeWidget,
section_divider: SectionDividerWidget,
- markdownEditor: MarkdownEditorWidget
+ markdownEditor: MarkdownEditorWidget,
};
const buildSchema = (formData: Post, tags: Tag[]) => {
@@ -28,8 +31,8 @@ const buildSchema = (formData: Post, tags: Tag[]) => {
title: "Post tags",
items: {
type: "number",
- enum: tags.map(t => t.id),
- enumNames: tags.map(t => t.name_fi),
+ enum: tags.map((t) => t.id),
+ enumNames: tags.map((t) => t.name_fi),
},
uniqueItems: true,
default: [],
@@ -61,7 +64,7 @@ const buildSchema = (formData: Post, tags: Tag[]) => {
title_fi: {
type: "string",
title: "Title",
- default: ""
+ default: "",
},
description_fi: {
type: "string",
@@ -80,7 +83,7 @@ const buildSchema = (formData: Post, tags: Tag[]) => {
title_en: {
type: "string",
title: "Title",
- default: ""
+ default: "",
},
description_en: {
type: "string",
@@ -92,10 +95,10 @@ const buildSchema = (formData: Post, tags: Tag[]) => {
title: "Content",
default: "",
},
- }
+ },
};
return schema;
-}
+};
const buildUISchema = (formData: Post) => {
const uiSchema = {
@@ -114,48 +117,48 @@ const buildUISchema = (formData: Post) => {
finnish_section_divider: {
"ui:widget": "section_divider",
"ui:options": {
- label: false
+ label: false,
},
},
english_section_divider: {
"ui:widget": "section_divider",
"ui:options": {
- label: false
+ label: false,
},
},
};
return uiSchema;
-}
+};
-interface MatchParams {
- id?: string;
-}
-
-type FeedCreatePageProps = RouteComponentProps;
-
-const FeedCreatePage: React.FC = ({ match: { params: { id } } }) => {
+const FeedCreatePage: NextPage = () => {
const [formData, setFormData] = useState(null);
const [tags, setTags] = useState([]);
const [error, setError] = useState(null);
const [statusMessage, setStatusMessage] = useState(null);
- useEffect(() => {
+ const router = useRouter();
+ let id: string;
+
+ if (router.query?.id && router.query.id !== "create") {
+ id = router.query.id as string;
+ }
+
+ useEffect(() => {
getTags()
- .then(res => setTags(res))
- .catch(err => setError(err))
+ .then((res) => setTags(res))
+ .catch((err) => setError(err));
const feedId = id && Number(id);
if (feedId !== undefined) {
- getPost(feedId)
- // getPost(feedId, true)
- .then(res => setFormData({
+ getPost(feedId, { auth: true })
+ .then((res) => setFormData({
...res,
- tags: (res.tags).map(inst => inst.id) as any,
+ tags: (res.tags).map((inst) => inst.id) as any,
}))
- .catch(err => setError(err))
+ .catch((err) => setError(err));
}
- }, [id])
+ }, [id]);
const onSubmit = async (data) => {
try {
@@ -176,7 +179,7 @@ const FeedCreatePage: React.FC = ({ match: { params: { id }
} catch (err) {
setError(err);
}
- }
+ };
const onChange = (data) => setFormData(data.formData);
const onFocus = () => setStatusMessage(null);
@@ -187,9 +190,9 @@ const FeedCreatePage: React.FC = ({ match: { params: { id }
return (
<>
-
+
-
+
= ({ match: { params: { id }
/>
);
-}
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default FeedCreatePage;
diff --git a/src/pages/admin/AdminFeedPage.tsx b/src/pages/admin/feed/index.tsx
similarity index 60%
rename from src/pages/admin/AdminFeedPage.tsx
rename to src/pages/admin/feed/index.tsx
index 8a6d601..03f79c4 100644
--- a/src/pages/admin/AdminFeedPage.tsx
+++ b/src/pages/admin/feed/index.tsx
@@ -1,12 +1,13 @@
import React, { useEffect, useState } from "react";
-import { Helmet } from "react-helmet";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
import { formatRelative } from "date-fns";
import AdminListCommon from "@views/admin/AdminListCommon";
-import Anchor from "@components/Anchor";
+import { Link } from "@components/index";
import AddLink from "@components/AddLink";
import { Post, getFeed } from "@models/Feed";
-const URL = "/admin/feed"
+const URL = "/admin/feed";
const renderData = (feed: Post[]) => {
if (!feed || feed.length === 0) {
@@ -23,9 +24,9 @@ const renderData = (feed: Post[]) => {
- {feed.map(post => (
+ {feed.map((post) => (
- {post.title_fi} {post.title_fi}
{post.description_fi}
{formatRelative(new Date(post.publish_time), new Date())}
@@ -33,26 +34,30 @@ const renderData = (feed: Post[]) => {
);
-}
+};
-const AdminFeedPage: React.FC = () => {
+const AdminFeedPage: NextPage = () => {
const [forms, setForms] = useState(null);
useEffect(() => {
getFeed({ auth: true })
- .then(res => setForms(res))
+ .then((res) => setForms(res));
}, []);
return (
-
-
+ <>
+
-
-
+
+
+
+
);
-}
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default AdminFeedPage;
diff --git a/src/pages/admin/index.tsx b/src/pages/admin/index.tsx
new file mode 100644
index 0000000..6c100e7
--- /dev/null
+++ b/src/pages/admin/index.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import AdminPageWrapper from "@views/common/AdminPageWrapper";
+
+const AdminFrontPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default AdminFrontPage;
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
diff --git a/src/pages/admin/JobAdCreatePage.tsx b/src/pages/admin/jobads/[id].tsx
similarity index 82%
rename from src/pages/admin/JobAdCreatePage.tsx
rename to src/pages/admin/jobads/[id].tsx
index 3f9dcd2..1ef10d3 100644
--- a/src/pages/admin/JobAdCreatePage.tsx
+++ b/src/pages/admin/jobads/[id].tsx
@@ -1,16 +1,19 @@
import React, { useEffect, useState } from "react";
-import { Helmet } from "react-helmet";
-import { RouteComponentProps } from "react-router-dom";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { useRouter } from "next/router";
import AdminCreateCommon from "@views/admin/AdminCreateCommon";
-import { JobAd, getJobAd, createJobAd, updateJobAd } from "@models/JobAd";
+import {
+ JobAd, getJobAd, createJobAd, updateJobAd,
+} from "@models/JobAd";
import DatetimeWidget from "@components/Widgets/DatetimeWidget";
-import SectionDividerWidget from "@components/Widgets/SectionDividerWidget/SectionDividerWidget";
+import SectionDividerWidget from "@components/Widgets/SectionDividerWidget";
import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
const widgets = {
datetime: DatetimeWidget,
section_divider: SectionDividerWidget,
- markdownEditor: MarkdownEditorWidget
+ markdownEditor: MarkdownEditorWidget,
};
const buildSchema = (formData: JobAd) => {
@@ -44,7 +47,7 @@ const buildSchema = (formData: JobAd) => {
title_fi: {
type: "string",
title: "Title",
- default: ""
+ default: "",
},
description_fi: {
type: "string",
@@ -63,7 +66,7 @@ const buildSchema = (formData: JobAd) => {
title_en: {
type: "string",
title: "Title",
- default: ""
+ default: "",
},
description_en: {
type: "string",
@@ -75,10 +78,10 @@ const buildSchema = (formData: JobAd) => {
title: "Content",
default: "",
},
- }
+ },
};
return schema;
-}
+};
const buildUISchema = (formData: JobAd) => ({
content_fi: {
@@ -93,36 +96,38 @@ const buildUISchema = (formData: JobAd) => ({
finnish_section_divider: {
"ui:widget": "section_divider",
"ui:options": {
- label: false
+ label: false,
},
},
english_section_divider: {
"ui:widget": "section_divider",
"ui:options": {
- label: false
+ label: false,
},
},
});
-interface MatchParams {
- id?: string;
-}
-
-type JobAdCreatePageProps = RouteComponentProps;
-
-const JobAdCreatePage: React.FC = ({ match: { params: { id } } }) => {
+const JobAdCreatePage: NextPage = () => {
const [formData, setFormData] = useState(null);
const [error, setError] = useState(null);
const [statusMessage, setStatusMessage] = useState(null);
+
+ const router = useRouter();
+
+ let id: string;
+
+ if (router.query?.id && router.query.id !== "create") {
+ id = router.query.id as string;
+ }
+
useEffect(() => {
const jobId = id && Number(id);
if (jobId !== undefined) {
getJobAd(jobId, true)
- .then(res => setFormData(res))
- .catch(err => setError(err))
+ .then((res) => setFormData(res))
+ .catch((err) => setError(err));
}
- }, [id])
-
+ }, [id]);
const onSubmit = async (data) => {
try {
@@ -139,7 +144,7 @@ const JobAdCreatePage: React.FC = ({ match: { params: { id
} catch (err) {
setError(err);
}
- }
+ };
const onChange = (data) => setFormData(data.formData);
const onFocus = () => setStatusMessage(null);
@@ -150,9 +155,9 @@ const JobAdCreatePage: React.FC = ({ match: { params: { id
return (
<>
-
+
-
+
= ({ match: { params: { id
/>
);
-}
+};
-export default JobAdCreatePage;
\ No newline at end of file
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
+
+export default JobAdCreatePage;
diff --git a/src/pages/admin/jobads/index.tsx b/src/pages/admin/jobads/index.tsx
new file mode 100644
index 0000000..824040a
--- /dev/null
+++ b/src/pages/admin/jobads/index.tsx
@@ -0,0 +1,67 @@
+import React, { useEffect, useState } from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { formatRelative } from "date-fns";
+import AdminListCommon from "@views/admin/AdminListCommon";
+import { Link } from "@components/index";
+import AddLink from "@components/AddLink";
+import { JobAd, getJobAds } from "@models/JobAd";
+
+const URL = "/admin/jobads";
+
+const renderData = (jobAds: JobAd[]) => {
+ if (!jobAds || jobAds.length === 0) {
+ return
+
+
+ );
+};
+
+const AdminJobAdPage: NextPage = () => {
+ const [jobAds, setAds] = useState(null);
+
+ useEffect(() => {
+ getJobAds({ auth: true })
+ .then((res) => setAds(res));
+ }, []);
+
+ return (
+ <>
+
+
+
+
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
+
+export default AdminJobAdPage;
diff --git a/src/pages/admin/login.tsx b/src/pages/admin/login.tsx
new file mode 100644
index 0000000..346c2dc
--- /dev/null
+++ b/src/pages/admin/login.tsx
@@ -0,0 +1,91 @@
+import React, { useState, useEffect } from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { useRouter } from "next/router";
+import styled from "styled-components";
+import { generateToken, setTokenCookie, isAuthenticated } from "@utils/auth";
+import AdminPageWrapper from "@views/common/AdminPageWrapper";
+
+const Main = styled.div`
+ input {
+ display: block;
+ }
+`;
+
+const DEFAULT_REDIRECT = "/admin";
+const AdminLoginPage: NextPage = () => {
+ const [username, setUsername] = useState("");
+ const [password, setPassword] = useState("");
+ const [error, setError] = useState("");
+ const router = useRouter();
+ const next = router.query.next as string || DEFAULT_REDIRECT;
+
+ useEffect(() => {
+ isAuthenticated().then((res) => {
+ if (res) {
+ router.push(next);
+ }
+ });
+ }, [router, next]);
+
+ const handleSubmit = async (e: React.FormEvent) => {
+ e.preventDefault();
+ try {
+ const token = await generateToken(username, password);
+ setTokenCookie(token);
+ router.push(next);
+ } catch (err) {
+ setError("Failed to log in!");
+ }
+ };
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
+
+export default AdminLoginPage;
diff --git a/src/pages/admin/logout.tsx b/src/pages/admin/logout.tsx
new file mode 100644
index 0000000..9c506ef
--- /dev/null
+++ b/src/pages/admin/logout.tsx
@@ -0,0 +1,15 @@
+import { NextPage } from "next";
+import { useRouter } from "next/router";
+import { deleteTokenCookie } from "@utils/auth";
+
+const AdminLogoutPage: NextPage = () => {
+ const router = useRouter();
+ // client-side-only code
+ if (typeof window !== "undefined") {
+ deleteTokenCookie();
+ router.push("/admin/login");
+ }
+ return null;
+};
+
+export default AdminLogoutPage;
diff --git a/src/pages/admin/SignupCreatePage.tsx b/src/pages/admin/signups/[id].tsx
similarity index 80%
rename from src/pages/admin/SignupCreatePage.tsx
rename to src/pages/admin/signups/[id].tsx
index a2cc984..f3c154a 100644
--- a/src/pages/admin/SignupCreatePage.tsx
+++ b/src/pages/admin/signups/[id].tsx
@@ -1,8 +1,11 @@
import React, { useEffect, useState } from "react";
-import { Helmet } from "react-helmet";
-import { RouteComponentProps } from "react-router-dom";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { useRouter } from "next/router";
import AdminCreateCommon from "@views/admin/AdminCreateCommon";
-import { SignupForm, createForm, getForm, updateForm } from "@models/SignupForm";
+import {
+ SignupForm, createForm, getForm, updateForm,
+} from "@models/SignupForm";
import DatetimeWidget from "@components/Widgets/DatetimeWidget";
import SignupQuestionsWidget from "@components/Widgets/SignupQuestionsWidget";
import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
@@ -11,13 +14,11 @@ import { buildValidationSchema } from "@views/SignUpPage/FormUtils";
const DEFAULT_EMAIL =
`Moikka,
-Ilmottautuminen saapui perille.`
-;
-
+Ilmottautuminen saapui perille.`;
const widgets = {
datetime: DatetimeWidget,
signup: SignupQuestionsWidget,
- markdownEditor: MarkdownEditorWidget
+ markdownEditor: MarkdownEditorWidget,
};
const buildSchema = (formData: SignupForm) => {
@@ -66,7 +67,7 @@ const buildSchema = (formData: SignupForm) => {
email_content: {
type: "string",
title: "Email on signup",
- default: DEFAULT_EMAIL
+ default: DEFAULT_EMAIL,
},
questions: {
type: "string",
@@ -76,7 +77,7 @@ const buildSchema = (formData: SignupForm) => {
},
};
return schema;
-}
+};
const buildUISchema = () => {
const uiSchema = {
@@ -94,31 +95,34 @@ const buildUISchema = () => {
},
};
return uiSchema;
-}
+};
-interface MatchParams {
- id?: string;
-}
-
-type SignupCreatePageProps = RouteComponentProps;
-
-const SignupCreatePage: React.FC = ({ match: { params: { id } } }) => {
+const SignupCreatePage: NextPage = () => {
const [formData, setFormData] = useState(null);
const [error, setError] = useState(null);
const [statusMessage, setStatusMessage] = useState(null);
+
+ const router = useRouter();
+
+ let id: string;
+
+ if (router.query?.id && router.query.id !== "create") {
+ id = router.query.id as string;
+ }
+
useEffect(() => {
const suId = id && Number(id);
if (suId !== undefined) {
getForm(suId, true)
- .then(res => {
+ .then((res) => {
setFormData({
...res,
- questions: JSON.stringify(res.questions) as any
+ questions: JSON.stringify(res.questions) as any,
});
})
- .catch(err => setError(err))
+ .catch((err) => setError(err));
}
- }, [id])
+ }, [id]);
const onSubmit = async (data: any) => {
try {
@@ -126,28 +130,28 @@ const SignupCreatePage: React.FC = ({ match: { params: {
const payload: SignupForm = {
...data.formData,
questions,
- schema: buildValidationSchema(questions)
- }
+ schema: buildValidationSchema(questions),
+ };
if (payload.id === undefined) {
const resp = await createForm(payload);
setStatusMessage("Sign-up created successfully");
setFormData({
...resp,
- questions: JSON.stringify(resp.questions) as any
+ questions: JSON.stringify(resp.questions) as any,
});
} else {
const resp = await updateForm(payload);
setStatusMessage("Sign-up updated successfully");
setFormData({
...resp,
- questions: JSON.stringify(resp.questions) as any
+ questions: JSON.stringify(resp.questions) as any,
});
}
} catch (err) {
setError(err);
}
- }
+ };
const onChange = (data) => setFormData(data.formData);
const onFocus = () => setStatusMessage(null);
@@ -158,9 +162,9 @@ const SignupCreatePage: React.FC = ({ match: { params: {
return (
<>
-
+
-
+
= ({ match: { params: {
} */}
);
-}
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default SignupCreatePage;
diff --git a/src/pages/admin/signups/[id]/email.tsx b/src/pages/admin/signups/[id]/email.tsx
new file mode 100644
index 0000000..71c4ab1
--- /dev/null
+++ b/src/pages/admin/signups/[id]/email.tsx
@@ -0,0 +1,96 @@
+import React, { useEffect, useState } from "react";
+import { NextPage, GetServerSideProps } from "next";
+import { useRouter } from "next/router";
+import AdminCreateCommon from "@views/admin/AdminCreateCommon";
+import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
+import { SignupForm, getForm, signupFormSendEmail } from "@models/SignupForm";
+
+const widgets = {
+ markdownEditor: MarkdownEditorWidget,
+};
+
+const buildSchema = (title: string) => ({
+ title,
+ type: "object",
+ required: ["subject", "content", "mode"],
+ properties: {
+ subject: {
+ type: "string",
+ title: "Title",
+ default: "",
+ },
+ content: {
+ type: "string",
+ title: "Content",
+ default: "",
+ },
+ mode: {
+ type: "string",
+ title: "Send to",
+ enum: [
+ "all",
+ "actual",
+ "reserved",
+ ],
+ default: "all",
+ },
+ },
+});
+
+const buildUISchema = () => ({
+ content: {
+ "ui:widget": "markdownEditor",
+ },
+});
+
+const SignupEmailPage: NextPage = () => {
+ const [signupForm, setSignupForm] = useState(null);
+
+ const router = useRouter();
+ const { id } = router.query;
+
+ useEffect(() => {
+ const formId = Number(id);
+ if (formId !== undefined) {
+ getForm(formId, true)
+ .then((res) => setSignupForm(res));
+ }
+ }, [id]);
+
+ const [error, setError] = useState(null);
+ const [statusMessage, setStatusMessage] = useState(null);
+
+ const onSubmit = async (data) => {
+ try {
+ const payload = data.formData;
+ await signupFormSendEmail(payload, id);
+ setStatusMessage("Email sent successfully");
+ } catch (err) {
+ setError(err);
+ }
+ };
+
+ // const onChange = (data) => setFormData(data.formData);
+ const onFocus = () => setStatusMessage(null);
+
+ const title = signupForm ? signupForm.title_fi : "Loading...";
+
+ return (
+ ;
-
-const StyledButton = styled(Button)<{ colorOverride: "red" | "green" }>`
+const StyledButton = styled(Button) <{ colorOverride: "red" | "green" }>`
background-color: ${(p: any) => p.colorOverride};
`;
-const SignupEmailPage: React.FC = ({ match: { params: { id } } }) => {
+const SignupEmailPage: NextPage = () => {
const [signupForm, setSignupForm] = useState(null);
const [signups, setSignups] = useState([]);
+
+ const router = useRouter();
+ const { id } = router.query;
+
useEffect(() => {
const formId = Number(id);
getForm(formId, true)
- .then(res => setSignupForm(res))
-
- getSignups(formId).then(res => setSignups(res))
+ .then((res) => setSignupForm(res));
+ getSignups(formId).then((res) => setSignups(res));
}, [id]);
const confirmDelete = async (signup: Signup, question: any) => {
- if(confirm(`Delete: ${signup.id}: ${signup.answer[question.id]}; Are you sure?`) === true) {
+ if (window.confirm(`Delete: ${signup.id}: ${signup.answer[question.id]}; Are you sure?`) === true) {
try {
await deleteSignup(signup.id);
- setSignups(signups.filter(s => s.id !== signup.id))
+ setSignups(signups.filter((s) => s.id !== signup.id));
} catch (err) {
- alert("Delete failed!")
+ window.alert("Delete failed!");
}
}
- }
-
+ };
const title = signupForm ? signupForm.title_fi : "Loading...";
- const questions = signupForm ? signupForm.questions.map(q => ({
+ const questions = signupForm ? signupForm.questions.map((q) => ({
title: q.name,
- id: q.id
+ id: q.id,
})) : [];
// Generate 2-dimensional array where rows are signups and columns are answers to questions.
- const CSVData = signups.map((s) => questions.map(q => s.answer[q.id]));
+ const CSVData = signups.map((s) => questions.map((q) => s.answer[q.id]));
// Add reserve signup "header"
if (signupForm?.quota) {
CSVData.splice(signupForm.quota, 0, ["RESERVE-SIGNUPS"]);
@@ -58,19 +55,16 @@ const SignupEmailPage: React.FC = ({ match: { params: { id
return (
-
-
-
- )};
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default SignupEmailPage;
diff --git a/src/pages/admin/AdminSignupPage.tsx b/src/pages/admin/signups/index.tsx
similarity index 57%
rename from src/pages/admin/AdminSignupPage.tsx
rename to src/pages/admin/signups/index.tsx
index 1b1d425..84b5f76 100644
--- a/src/pages/admin/AdminSignupPage.tsx
+++ b/src/pages/admin/signups/index.tsx
@@ -1,12 +1,13 @@
import React, { useEffect, useState } from "react";
-import { Helmet } from "react-helmet";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
import { formatRelative } from "date-fns";
import AdminListCommon from "@views/admin/AdminListCommon";
-import Anchor from "@components/Anchor";
+import { Link } from "@components/index";
import AddLink from "@components/AddLink";
import { SignupForm, getForms } from "@models/SignupForm";
-const URL = "/admin/signups"
+const URL = "/admin/signups";
const renderData = (signupForms: SignupForm[]) => {
if (!signupForms || signupForms.length === 0) {
@@ -25,38 +26,42 @@ const renderData = (signupForms: SignupForm[]) => {
- {signupForms.map(signupForm => (
+ {signupForms.map((signupForm) => (
- {signupForm.title_fi} {signupForm.title_fi}
{formatRelative(new Date(signupForm.start_time), new Date())}
{formatRelative(new Date(signupForm.end_time), new Date())}
- View Send View
+ Send
))}
);
-}
+};
-const AdminSignupPage: React.FC = () => {
+const AdminSignupPage: NextPage = () => {
const [forms, setForms] = useState(null);
useEffect(() => {
getForms(true)
- .then(res => setForms(res))
+ .then((res) => setForms(res));
}, []);
return (
-
-
+ <>
+
-
-
+
+
+
+
);
-}
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
export default AdminSignupPage;
diff --git a/src/pages/events/[id].tsx b/src/pages/events/[id].tsx
new file mode 100644
index 0000000..9490c6f
--- /dev/null
+++ b/src/pages/events/[id].tsx
@@ -0,0 +1,45 @@
+import React from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { useRouter } from "next/router";
+import {
+ Event, useFetchEvents, eventFetcher, generateFetchParams,
+} from "@models/Event";
+import EventPageView from "@views/EventPage/EventPageView";
+import PageWrapper from "@views/common/PageWrapper";
+import LoadingView from "@views/common/LoadingView";
+
+interface InitialProps {
+ initialEvent: Event;
+}
+
+const EventPage: NextPage = ({ initialEvent }) => {
+ const router = useRouter();
+ const { id } = router.query;
+ const { data, error } = useFetchEvents({ initialData: initialEvent, id: id as string });
+ if (!data) return
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async (context) => {
+ const { id } = context.query;
+ const { url, config } = generateFetchParams(id as string);
+ const initialEvent = await eventFetcher(url, config);
+ return {
+ props: {
+ initialEvent,
+ },
+ };
+};
+
+export default EventPage;
diff --git a/src/pages/in_english.tsx b/src/pages/in_english.tsx
new file mode 100644
index 0000000..058347b
--- /dev/null
+++ b/src/pages/in_english.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { NextPage } from "next";
+import Head from "next/head";
+import InEnglishPageView from "@views/InEnglishPage/InEnglishPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const InEnglishPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default InEnglishPage;
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
new file mode 100644
index 0000000..b4350ad
--- /dev/null
+++ b/src/pages/index.tsx
@@ -0,0 +1,54 @@
+import React from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import {
+ Event, useFetchEvents, eventFetcher, generateFetchParams as eventParams,
+} from "@models/Event";
+import {
+ Post, useFetchFeed, feedFetcher, generateFetchParams as feedParams,
+} from "@models/Feed";
+import FrontPageView from "@views/FrontPage/FrontPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const eventOptions = {
+ onlyNonPast: true,
+ limit: 4,
+};
+
+interface InitialProps {
+ initialEvents: Event[];
+ initialFeed: Post[];
+}
+
+const FrontPage: NextPage = ({ initialEvents, initialFeed }) => {
+ const eventResult = useFetchEvents({ initialData: initialEvents, options: eventOptions });
+ const feedResult = useFetchFeed({ initialData: initialFeed });
+
+ return (
+ <>
+
+
+
+
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => {
+ let url: string;
+ let config: any;
+ ({ url, config } = eventParams("", eventOptions));
+ const initialEvents = await eventFetcher(url, config);
+ ({ url, config } = feedParams(""));
+ const initialFeed = await feedFetcher(url, config);
+ return {
+ props: {
+ initialEvents,
+ initialFeed,
+ },
+ };
+};
+
+export default FrontPage;
diff --git a/src/pages/kilta/fuksi.tsx b/src/pages/kilta/fuksi.tsx
new file mode 100644
index 0000000..dfe80af
--- /dev/null
+++ b/src/pages/kilta/fuksi.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { NextPage } from "next";
+import Head from "next/head";
+import FreshmenPageView from "@views/FreshmenPage/FreshmenPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const FreshmenPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default FreshmenPage;
diff --git a/src/pages/kilta/index.tsx b/src/pages/kilta/index.tsx
new file mode 100644
index 0000000..01b7413
--- /dev/null
+++ b/src/pages/kilta/index.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { NextPage } from "next";
+import Head from "next/head";
+import GuildPageView from "@views/GuildPage/GuildPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const GuildPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default GuildPage;
diff --git a/src/pages/kilta/kunnia.tsx b/src/pages/kilta/kunnia.tsx
new file mode 100644
index 0000000..1f9b285
--- /dev/null
+++ b/src/pages/kilta/kunnia.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { NextPage } from "next";
+import Head from "next/head";
+import HonoraryPageView from "@views/HonoraryPage/HonoraryPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const HonoraryPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default HonoraryPage;
diff --git a/src/pages/kilta/toiminta.tsx b/src/pages/kilta/toiminta.tsx
new file mode 100644
index 0000000..1353b9b
--- /dev/null
+++ b/src/pages/kilta/toiminta.tsx
@@ -0,0 +1,53 @@
+import React from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import {
+ Event, useFetchEvents, eventFetcher, generateFetchParams as eventParams,
+} from "@models/Event";
+import {
+ Post, useFetchFeed, feedFetcher, generateFetchParams as feedParams,
+} from "@models/Feed";
+import ActualPageView from "@views/ActualPage/ActualPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const eventOptions = {
+ onlyNonPast: true,
+};
+
+interface InitialProps {
+ initialEvents: Event[];
+ initialFeed: Post[];
+}
+
+const ActualPage: NextPage = ({ initialEvents, initialFeed }) => {
+ const eventResult = useFetchEvents({ initialData: initialEvents, options: eventOptions });
+ const feedResult = useFetchFeed({ initialData: initialFeed });
+
+ return (
+ <>
+
+
+
+
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => {
+ let url: string;
+ let config: any;
+ ({ url, config } = eventParams("", eventOptions));
+ const initialEvents = await eventFetcher(url, config);
+ ({ url, config } = feedParams(""));
+ const initialFeed = await feedFetcher(url, config);
+ return {
+ props: {
+ initialEvents,
+ initialFeed,
+ },
+ };
+};
+
+export default ActualPage;
diff --git a/src/pages/opinnot_ja_ura.tsx b/src/pages/opinnot_ja_ura.tsx
new file mode 100644
index 0000000..c9a2604
--- /dev/null
+++ b/src/pages/opinnot_ja_ura.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { NextPage } from "next";
+import Head from "next/head";
+import StudiesPageView from "@views/StudiesPage/StudiesPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const StudiesPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default StudiesPage;
diff --git a/src/pages/signup/[...params].tsx b/src/pages/signup/[...params].tsx
new file mode 100644
index 0000000..71b0d66
--- /dev/null
+++ b/src/pages/signup/[...params].tsx
@@ -0,0 +1,104 @@
+import React, { useEffect, useState } from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import { useRouter } from "next/router";
+import { getForm, SignupForm } from "@models/SignupForm";
+import {
+ createSignup, updateSignup, getSignupUUID, Signup,
+} from "@models/Signup";
+import SignUpPageView from "@views/SignUpPage/SignUpPageView";
+import PageWrapper from "@views/common/PageWrapper";
+import noop from "@utils/noop";
+
+const parseQueryParams = (params: any) => {
+ let formId;
+ let signupId;
+ const uuid = params?.[2];
+
+ if (params?.[0] === "edit") {
+ signupId = params?.[1];
+ } else {
+ formId = params?.[0];
+ }
+
+ return {
+ formId,
+ signupId,
+ uuid,
+ };
+};
+
+const SignUpPage: NextPage = () => {
+ const router = useRouter();
+ const { formId, signupId, uuid } = parseQueryParams(router.query.params);
+
+ const [signUpForm, setForm] = useState(null);
+ const [formData, setFormData] = useState({});
+ const [statusMessage, setStatus] = useState(null);
+
+ useEffect(() => {
+ const fetchSignUpForm = async (id: number): Promise => {
+ const formPromise = getForm(id);
+ formPromise.then((form) => {
+ setForm(form);
+ });
+ return formPromise;
+ };
+
+ const fetchSignUp = async (id: number, uniqueId: string): Promise => {
+ const signupPromise = getSignupUUID(id, uniqueId);
+ signupPromise.then((signup) => setFormData(signup.answer));
+ return signupPromise;
+ };
+
+ if (signupId) {
+ fetchSignUp(signupId, uuid).then((s) => fetchSignUpForm(s.signupForm_id));
+ } else if (formId) {
+ fetchSignUpForm(formId);
+ }
+ }, [formId, signupId, uuid]);
+
+ const onSubmit = async (data) => {
+ const payload: Signup = {
+ id: signupId ? Number(signupId) : undefined,
+ signupForm_id: signUpForm.id,
+ answer: data.formData,
+ };
+
+ try {
+ if (uuid) {
+ const resp = await updateSignup(payload, uuid);
+ // TODO: Update signup list, so user sees possible changes in the list
+ setStatus("Sign-up submission updated successfully");
+ } else {
+ const resp = await createSignup(payload);
+ // TODO: Fetch/update signup list, so user sees the signup in the list
+ setStatus("Sign-up submitted successfully");
+ }
+ } catch (error) {
+ console.error(error);
+ setStatus("Bad request");
+ }
+ };
+
+ return (
+ <>
+
+
+
+
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => ({ props: {} });
+
+export default SignUpPage;
diff --git a/src/pages/yhteystiedot.tsx b/src/pages/yhteystiedot.tsx
new file mode 100644
index 0000000..fcb1971
--- /dev/null
+++ b/src/pages/yhteystiedot.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { NextPage } from "next";
+import Head from "next/head";
+import ContactsPageView from "@views/ContactsPage/ContactsPageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+const ContactsPage: NextPage = () => (
+ <>
+
+
+
+
+
+
+);
+
+export default ContactsPage;
diff --git a/src/pages/yritysyhteistyo.tsx b/src/pages/yritysyhteistyo.tsx
new file mode 100644
index 0000000..094e52b
--- /dev/null
+++ b/src/pages/yritysyhteistyo.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+import { NextPage, GetServerSideProps } from "next";
+import Head from "next/head";
+import {
+ JobAd, useFetchJobAds, jobAdFetcher, generateFetchParams,
+} from "@models/JobAd";
+import CorporatePageView from "@views/CorporatePage/CorporatePageView";
+import PageWrapper from "@views/common/PageWrapper";
+
+interface InitialProps {
+ initialJobAds: JobAd[];
+}
+
+const CorporatePage: NextPage = ({ initialJobAds }) => {
+ const { data, error } = useFetchJobAds({ initialData: initialJobAds });
+ return (
+ <>
+
+
+
+
+
+
+ );
+};
+
+export const getServerSideProps: GetServerSideProps = async () => {
+ const { url } = generateFetchParams();
+ const initialJobAds = await jobAdFetcher(url);
+ return {
+ props: {
+ initialJobAds,
+ },
+ };
+};
+
+export default CorporatePage;
diff --git a/src/routes.tsx b/src/routes.tsx
deleted file mode 100644
index f11d6ff..0000000
--- a/src/routes.tsx
+++ /dev/null
@@ -1,108 +0,0 @@
-import React from "react";
-import { Switch, Route } from "react-router-dom";
-import { Helmet } from "react-helmet";
-import FrontPage from "./pages/FrontPage";
-import GuildPage from "./pages/GuildPage";
-import NotFoundPage from "./pages/NotFoundPage";
-import CommonPage from "./pages/CommonPage";
-import JsonLD from "@components/JsonLD";
-import "./index.scss";
-import AdminFrontPage from "./pages/admin/AdminFrontView";
-import AdminEventPage from "./pages/admin/AdminEventPage";
-import AdminFeedPage from "./pages/admin/AdminFeedPage";
-import AdminCommonPage from "./pages/admin/AdminCommonPage";
-import AdminSignupPage from "./pages/admin/AdminSignupPage";
-import AdminLoginPage from "./pages/admin/AdminLoginPage";
-import AdminLogoutPage from "./pages/admin/AdminLogoutPage";
-import EventCreatePage from "./pages/admin/EventCreatePage";
-import FeedCreatePage from "./pages/admin/FeedCreatePage";
-import ContactsPage from "./pages/ContactsPage";
-import SignupCreatePage from "./pages/admin/SignupCreatePage";
-import SignupEmailPage from "./pages/admin/SignupEmailPage";
-import SignupListPage from "./pages/admin/SignupListPage";
-import SignUpPage from "./pages/SignUpPage";
-import ActualPage from "./pages/ActualPage";
-import FreshmenPage from "./pages/FreshmenPage";
-import StudiesPage from "./pages/StudiesPage";
-import CorporatePage from "./pages/CorporatePage";
-import InEnglishPage from "./pages/InEnglishPage";
-import EventPage from "./pages/EventPage";
-import AdminJobAdPage from "@pages/admin/AdminJobAdPage";
-import JobAdCreatePage from "@pages/admin/JobAdCreatePage";
-
-const renderPage = (Page) => (props): JSX.Element => {
- return
-
- Aalto-yliopiston Sähköinsinoorikilta ry
-
-
-
-
-
- {commonRoutes.map(r =>
-
- );
- }
-}
-
-export default Routes;
diff --git a/src/server/App.tsx b/src/server/App.tsx
deleted file mode 100644
index 1d26c4c..0000000
--- a/src/server/App.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-import { StaticRouter } from "react-router-dom";
-import Routes from "../routes";
-
-export default ({ url, context }) => (
-
-
-);
diff --git a/src/server/StaticContext.ts b/src/server/StaticContext.ts
deleted file mode 100644
index c1df6a4..0000000
--- a/src/server/StaticContext.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export interface StaticContext {
- resolutions: { [key: string]: any };
- promises: { [key: string]: Promise };
-}
diff --git a/src/server/index.ts b/src/server/index.ts
deleted file mode 100644
index 652f45c..0000000
--- a/src/server/index.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-import React from "react";
-import { Helmet } from "react-helmet";
-import express from "express";
-import { renderToString } from "react-dom/server";
-import morgan from "morgan";
-import helmet from "helmet";
-import compression from "compression";
-
-import dotenv from "dotenv";
-
-dotenv.config();
-
-console.log(`API_URL: ${process.env.API_URL}`);
-
-import App from "./App";
-import fs from "fs";
-import path from "path";
-import { StaticContext } from "./StaticContext";
-import { ServerStyleSheet } from "styled-components";
-
-const port = 3000;
-const server = express();
-
-const indexHtml = fs.readFileSync(path.resolve("./dist/index.html"), "utf-8");
-const html = (body, styles, title, meta) => {
- const withBody = indexHtml.replace("", `
{this.renderQuestions()}
{placeholder}
diff --git a/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx b/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx
index e8905ba..05bf10b 100644
--- a/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx
+++ b/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx
@@ -2,9 +2,10 @@ import React from "react";
import styled from "styled-components";
import shortid from "shortid";
import { DragDropContext, Droppable } from "react-beautiful-dnd";
-import { Question } from "."
-import AddIcon from "@assets/img/add-icon.png";
+import { Question } from ".";
+import colors from "@theme/colors";
import QuestionList from "./QuestionList";
+import AddIcon from "@components/AddIcon";
const Widget = styled.div`
& > button {
@@ -16,14 +17,21 @@ const Widget = styled.div`
padding: 0;
margin: 1rem 0;
- & > img {
- margin-right: 8px;
- margin-top: -2px;
- width: 20px;
+ & > div {
+ margin-right: 8px !important;
+ margin-top: -2px !important;
}
}
`;
+const AddQuestionButton = styled.button`
+ background-color: ${colors.blue1};
+ color: ${colors.white};
+ border: none;
+ outline: none;
+ cursor: pointer;
+`;
+
interface SignupQuestionsWidgetProps {
value: string;
onChange: (value: string) => void;
@@ -36,7 +44,7 @@ const SignupQuestionsWidget: React.FCLoading
-
- return (
- <>
-
-
-
-
-
-);
-
-export default InEnglishPage;
diff --git a/src/pages/SignUpPage.tsx b/src/pages/SignUpPage.tsx
deleted file mode 100644
index 121e487..0000000
--- a/src/pages/SignUpPage.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import React from "react";
-import { Helmet } from "react-helmet";
-import { getForm, SignupForm } from "@models/SignupForm";
-import { createSignup, updateSignup, getSignupUUID, Signup } from "@models/Signup";
-import SignUpPageView from "@views/SignUpPage/SignUpPageView";
-import { RouteComponentProps } from "react-router-dom";
-
-interface MatchParams {
- formId?: string;
- signupId?: string;
- uuid?: string;
-}
-
-type SignUpPageProps = RouteComponentPropsSIK Admin
-No advertisements.
;
- }
-
- return (
- | Title | -Description | -Autohide | -
|---|---|---|
| {ad.description_fi} | -- {ad.autohide_enabled ? - formatRelative(new Date(ad.autohide_at), new Date()) - : "Disabled"} - | -
Job advertisements
-
- { error }
-
- );
- }
-
- getRedirectURL = () => {
- const { location } = this.props;
- const { search } = location;
- const params = qs.parse(search);
- const { next } = params;
- // TODO: Any change of next being string[]? We get type error on without the cast.
- return next as string || DEFAULT_REDIRECT;
- }
-
- render() {
- const { username, password, isAuthenticated } = this.state;
- const next = this.getRedirectURL();
-
- if (isAuthenticated) {
- return Log in to SIK Admin
- { next && next !== DEFAULT_REDIRECT && ( -You have to log in first.
- ) }
-
- { this.renderError() }
- Events
-Events
+Feed
-Feed
+
+
+ SIK Admin
+No advertisements.
;
+ }
+
+ return (
+ | Title | +Description | +Autohide | +
|---|---|---|
| {ad.title_fi} | +{ad.description_fi} | ++ {ad.autohide_enabled ? + formatRelative(new Date(ad.autohide_at), new Date()) + : "Disabled"} + | +
Job advertisements
+Log in to SIK Admin
+ {next && next !== DEFAULT_REDIRECT && ( +You have to log in first.
+ )}
+
+ {error && (
+
+ {error}
+
+ )}
+ {title}: Sign-ups
| {q.title} | ))}
- |
|---|---|
| {s.answer[q.id]} | ))}
- |
@@ -96,6 +90,9 @@ const SignupEmailPage: React.FC
Sign-up forms
-Sign-up forms
+${body}
`);
- const withHead = withBody.replace("", `${title}${meta}${styles}`);
- return withHead;
-};
-
-server.use(morgan("short"));
-server.use(helmet());
-server.use(helmet.hidePoweredBy());
-server.use(compression());
-server.use("/assets", express.static("dist/assets"));
-server.use("/js", express.static("dist/js"));
-
-server.get("*", async (req, res) => {
- const context: StaticContext = {
- resolutions: {}, promises: {},
- };
-
- // Styled-components Step 1: Create an instance of ServerStyleSheet
- const sheet = new ServerStyleSheet();
-
- // Styled-components Step 2: Retrieve styles from components in the page
- const firstPassRenderResult = renderToString(
- sheet.collectStyles(
- React.createElement(App, { url: req.url, context })
- )
- );
-
- const promiseKeys = Object.keys(context.promises);
- let result: string;
- if (promiseKeys.length === 0) {
- /* No promises to resolve on the first pass. Render html normally. */
- result = firstPassRenderResult;
- } else {
- /* Some promises have to be resolved before rendering the page. */
- const promiseEntries = promiseKeys.map(async key => {
- const promise = context.promises[key];
- return { key, value: await promise };
- });
-
- /* Resolve all promises. */
- const awaitedEntries = await Promise.all(promiseEntries);
-
- /* Store all resolutions in the context. */
- awaitedEntries.forEach(entry => {
- context.resolutions[entry.key] = entry.value;
- });
-
- /* Render a second time with all resolved data. */
- // Styled-components Step 2: Retrieve styles from components in the page
- const secondPassRenderResult = renderToString(
- sheet.collectStyles(
- React.createElement(App, { url: req.url, context })
- )
- );
- result = secondPassRenderResult;
- }
-
- // Styled-components Step 3: Extract the styles as