Add possibilty to register to editions

src/api/edition.ts

@@ -0,0 +1,20 @@
+import { axios } from "@/api/index";
+
+const EDITIONS_ENDPOINT = "/editions";
+const REGISTER_ENDPOINT = "/register";
+
+export async function editions() {
+    const response = await axios.get(EDITIONS_ENDPOINT);
+
+    return response.data;
+}
+
+export async function join(key: string): Promise<boolean> {
+    try {
+        await axios.post(REGISTER_ENDPOINT, JSON.stringify(key), { headers: { "Content-Type": "application/json" } });
+        return true;
+    } catch (error) {
+        console.error(error);
+        return false;
+    }
+}

src/api/index.ts

@@ -1,12 +1,36 @@
 import Axios from "axios";
+import store from "@/state/store"
+import { AppState } from "@/state/reducer";
+import { UserState } from "@/state/reducer/user";
+
+
 import * as user from "./user";
+import * as edition from "./edition";
 
 export const axios = Axios.create({
-    baseURL: "https://system-praktyk.stg.kadet.net/api",
+    baseURL: "http://system-praktyk-front.localhost:3000/api/",
+})
+
+axios.interceptors.request.use(config => {
+    const state = store.getState() as AppState;
+    const user = state.user as UserState;
+
+    if (!user.loggedIn) {
+        return config;
+    }
+
+    return {
+        ...config,
+        headers: {
+            ...config.headers,
+            Authorization: `Bearer ${ user.token }`
+        }
+    }
 })
 
 const api = {
     user,
+    edition
 }
 
 export default api;

src/pages/edition/register.tsx

@@ -0,0 +1,29 @@
+import React, { useState } from "react";
+import { Page } from "@/pages/base";
+import { useTranslation } from "react-i18next";
+import { Button, Container, TextField } from "@material-ui/core";
+
+import api from "@/api";
+
+export const RegisterEditionPage = () => {
+    const { t } = useTranslation();
+
+    const [key, setKey] = useState<string>("");
+
+    const handleRegister = () => {
+        api.edition.join(key);
+    }
+
+    return <Page>
+        <Page.Header maxWidth="md">
+            <Page.Title>{ t("edition.register") }</Page.Title>
+        </Page.Header>
+
+        <Container maxWidth="md">
+            <TextField label={ t("edition.key") } fullWidth
+                       onChange={ (ev: React.ChangeEvent<HTMLInputElement>) => setKey(ev.currentTarget.value) }
+                       value={ key } />
+            <Button onClick={ handleRegister }>{ t("edition.register") }</Button>
+        </Container>
+    </Page>
+}

src/pages/main.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from "react";
+import React, { useEffect, useMemo } from "react";
 import { Page } from "@/pages/base";
 import { Button, Container, Stepper, Typography } from "@material-ui/core";
 import { Link as RouterLink, Redirect } from "react-router-dom";
@@ -13,6 +13,7 @@ import { ProposalStep } from "@/pages/steps/proposal";
 import { PlanStep } from "@/pages/steps/plan";
 import { InsuranceState } from "@/state/reducer/insurance";
 import { InsuranceStep } from "@/pages/steps/insurance";
+import api from "@/api";
 
 export const MainPage = () => {
     const { t } = useTranslation();
@@ -24,6 +25,8 @@ export const MainPage = () => {
 
     const missingStudentData = useMemo(() => student ? getMissingStudentData(student) : [], [student]);
 
+    useEffect(() => void api.edition.editions())
+
     if (!student) {
         return <Redirect to={ route("user_login") }/>;
     }

src/routing.tsx

@@ -5,6 +5,7 @@ import { InternshipProposalFormPage, InternshipProposalPreviewPage } from "@/pag
 import { NotFoundPage } from "@/pages/errors/not-found";
 import SubmitPlanPage from "@/pages/internship/plan";
 import { UserLoginPage } from "@/pages/user/login";
+import { RegisterEditionPage } from "@/pages/edition/register";
 
 type Route = {
     name?: string;
@@ -15,6 +16,10 @@ type Route = {
 export const routes: Route[] = [
     { name: "home", path: "/", exact: true, content: () => <MainPage/> },
 
+    // edition
+    { name: "edition_register", path: "/edition/register", exact: true, content: () => <RegisterEditionPage/> },
+
+    // internship
     { name: "internship_proposal", path: "/internship/proposal", exact: true, content: () => <InternshipProposalFormPage/> },
     { name: "internship_proposal_preview", path: "/internship/preview/proposal", exact: true, content: () => <InternshipProposalPreviewPage/> },
     { name: "internship_plan", path: "/internship/plan", exact: true, content: () => <SubmitPlanPage/> },

webpack.config.js

@@ -54,6 +54,15 @@ const config = {
         disableHostCheck: true,
         historyApiFallback: true,
         overlay: true,
+        proxy: {
+            "/api": {
+                target: "http://system-praktyk-front.localhost:8080/",
+                changeOrigin: true,
+                pathRewrite: {
+                    "^/api": ''
+                }
+            }
+        }
     },
     optimization: {
         usedExports: true