summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/clients/api_client.ts12
-rw-r--r--src/clients/loaders.ts17
-rw-r--r--src/components/forms/login_form.tsx5
-rw-r--r--src/lib/token.ts12
-rw-r--r--src/main.tsx8
-rw-r--r--src/routes/account/account.tsx6
6 files changed, 52 insertions, 8 deletions
diff --git a/src/clients/api_client.ts b/src/clients/api_client.ts
index c55a365..7d2cf34 100644
--- a/src/clients/api_client.ts
+++ b/src/clients/api_client.ts
@@ -3,16 +3,16 @@ import axios from "axios";
export class ApiClient {
readonly url = "http://localhost:3000/api";
- async get(path: string, params?: URLSearchParams) {
+ async get(path: string, params?: URLSearchParams, headers?: object) {
const request_url = `${ this.url }${ path }`;
- const response = await this.makeGetRequest(request_url);
+ const response = await this.makeGetRequest(request_url, headers);
return response;
}
- async post(path: string, data: FormData) {
+ async post(path: string, data: FormData, headers?: object) {
const request_url = `${ this.url }${ path }`;
- const response = await axios.post(request_url, data, { headers: { "Content-Type": "multipart/form-data"} });
+ const response = await axios.post(request_url, data, headers);
return response;
}
@@ -27,9 +27,9 @@ export class ApiClient {
return [product_response, product_reviews];
}
- private async makeGetRequest(request_url: string) {
+ private async makeGetRequest(request_url: string, headers?: object) {
try {
- const response = await axios.get(request_url);
+ const response = await axios.get(request_url, headers);
return response
} catch(error) {
diff --git a/src/clients/loaders.ts b/src/clients/loaders.ts
index 334f8aa..2af7770 100644
--- a/src/clients/loaders.ts
+++ b/src/clients/loaders.ts
@@ -1,3 +1,5 @@
+import { redirect } from "react-router-dom";
+import Token from "../lib/token";
import { ApiClient } from "./api_client";
export async function loader({ request }) {
@@ -8,6 +10,21 @@ export async function loader({ request }) {
return response;
}
+export async function accountLoader() {
+ const client = new ApiClient();
+ const token = new Token();
+
+ if(!token.present())
+ return redirect("/products");
+
+ const headers = {
+ "Authentication": `Bearer ${ token.get() }`
+ };
+
+ const response = await client.get("/account", undefined, headers);
+ return response;
+}
+
export async function productLoader({ params }) {
const client = new ApiClient();
const response = await client.getProduct(params.productId);
diff --git a/src/components/forms/login_form.tsx b/src/components/forms/login_form.tsx
index f08d2c5..44c3da5 100644
--- a/src/components/forms/login_form.tsx
+++ b/src/components/forms/login_form.tsx
@@ -35,9 +35,12 @@ export function LoginForm() {
const client = new ApiClient();
const form = event.target;
const formData = new FormData(form);
+ const headers = {
+ "Content-Type": "multipart/form-data"
+ };
try {
- const response = await client.post("/login", formData);
+ const response = await client.post("/login", formData, headers);
const token = new Token();
token.set(response.data.token);
token.setRefresh(response.data.refresh);
diff --git a/src/lib/token.ts b/src/lib/token.ts
index 8508cac..f838ac0 100644
--- a/src/lib/token.ts
+++ b/src/lib/token.ts
@@ -1,4 +1,12 @@
+import { ApiClient } from "../clients/api_client";
+
export default class Token {
+ client: ApiClient;
+
+ constructor() {
+ this.client = new ApiClient();
+ }
+
get() {
return sessionStorage.getItem("token");
}
@@ -23,4 +31,8 @@ export default class Token {
sessionStorage.removeItem("token");
sessionStorage.removeItem("refresh");
}
+
+ refresh() {
+ this.client.post("/refresh_tokens")
+ }
} \ No newline at end of file
diff --git a/src/main.tsx b/src/main.tsx
index 6e36c31..7c15ecb 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -4,8 +4,9 @@ import { BrowserRouter, createBrowserRouter, Navigate, RouterProvider } from 're
import Products from "./routes/products/products";
import Product from "./routes/products/product";
import Companies from "./routes/companies/companies";
+import Account from "./routes/account/account";
import Layout from "./components/layout";
-import { loader, productLoader } from "./clients/loaders";
+import { accountLoader, loader, productLoader } from "./clients/loaders";
import './index.css';
const routes = [
@@ -25,6 +26,11 @@ const routes = [
element: <Companies/>
},
{
+ path: "/companies",
+ loader: accountLoader,
+ element: <Account/>
+ },
+ {
path: '/',
element: <Navigate to='/products'/>
}
diff --git a/src/routes/account/account.tsx b/src/routes/account/account.tsx
new file mode 100644
index 0000000..57ea748
--- /dev/null
+++ b/src/routes/account/account.tsx
@@ -0,0 +1,6 @@
+export default function Account() {
+ return(
+ <>
+ </>
+ );
+} \ No newline at end of file