new features

design/images/promo.tsx

@@ -1,21 +1,5 @@
-import promo2 from './51wdlDCbVHL._SX3000_.jpg';
-import promo1 from './6167vdrHU-L._SX3000_.jpg';
-import promo3 from './61DUO0NqyyL._SX3000_.jpg';
-import promo4 from './61TD5JLGhIL._SX3000_.jpg';
-import promo5 from './61Y1w2JbF2L._SX3000_.jpg';
-import promo6 from './61jovjd+f9L._SX3000_.jpg';
-import promo7 from './717kU6K3R2L._SX3000_.jpg';
-import promo8 from './71bmrI6EfqL._SX3000_.jpg';
-import promo9 from './71qid7QFWJL._SX3000_.jpg';
+import promo1 from './78913.jpg';
+import promo2 from './Zhivchik_15.jpg';
+import promo3 from './maxresdefault.jpg';
 
-export const promo = [
-	promo1,
-	promo2,
-	promo3,
-	promo4,
-	promo5,
-	promo6,
-	promo7,
-	promo8,
-	promo9,
-];
+export const promo = [promo2, promo1, promo3];

src/api/serverApi.ts

@@ -1,7 +1,7 @@
 import axios from 'axios';
 
 export const serverApi = axios.create({
-	baseURL: 'https://store-server-eight.vercel.app',
+	baseURL: 'http://localhost:3000',
 	headers: {
 		'Content-Type': 'application/json',
 	},

src/api/serverApiClient.ts

@@ -0,0 +1,30 @@
+import axios from 'axios';
+
+export const serverApiClient = axios.create({
+	baseURL: 'http://localhost:3000',
+	headers: {
+		'Content-Type': 'application/json',
+	},
+});
+
+serverApiClient.interceptors.request.use(
+	(config) => {
+		config.headers = {
+			authorization: `Bearer ${localStorage.getItem('token')}`,
+		};
+
+		return config;
+	},
+	(error) => {}
+);
+
+serverApiClient.interceptors.response.use(
+	(config) => {
+		config.headers = {
+			authorization: `Bearer ${localStorage.getItem('token')}`,
+		};
+
+		return config;
+	},
+	(error) => {}
+);

src/components/layout/Layout.tsx

@@ -1,47 +1,41 @@
 import React, { useEffect, useState } from 'react';
 import Header from './header/Header';
 
-import { AmazonCategory } from '@/services/Amazon/AmazonCategory';
-import { IAmazonCategory } from '@/types/categories.interface';
 import DrawCategory from '../ui/drawer/DrawCategory';
+import { CategoryService } from '@/services/Server/ServerCategory';
 
 interface ILayout {
-    children?: React.ReactNode;
+	children?: React.ReactNode;
 }
 
 // TODO: change categories variable to object like {data, changeData, loading, error} or set 'em to redux storage
 
 const Layout: React.FC<ILayout> = ({ children }) => {
-	const [categories, setCategories] = useState<IAmazonCategory[] | null>(null);
-    const [loading, setLoading] = useState(false);
-
-	useEffect(() => {
-        setLoading(true);
-        (async () => {
-            const response = await AmazonCategory.getAllCategories()
-			console.log(response);
-
+	const [categories, setCategories] = useState<any>(null);
+	const [loading, setLoading] = useState(false);
 
+	useEffect(() => {
+		setLoading(true);
+		(async () => {
+			const response = await CategoryService.getAllCategories();
 			if (response) {
-				setCategories(response)
-			} else setCategories([])
-            setLoading(false);
-        })()
+				setCategories(response);
+			} else setCategories([]);
+			setLoading(false);
+		})();
 	}, []);
 
-    if (loading) return <div>Loading...</div>
+	if (loading) return <div>Loading...</div>;
 
 	// TODO: create recurcive function for fetching data
-	
+
 	return (
-		<main style={{width: '100%'}}>
+		<main style={{ width: '100%' }}>
 			<Header />
 			<DrawCategory categories={categories} />
-			<section style={{display: 'flex'}}>
-				{children}
-			</section>
+			<section style={{ display: 'flex' }}>{children}</section>
 		</main>
-	)
-}
+	);
+};
 
-export default Layout
+export default Layout;

src/components/layout/auth/LoginForm.tsx

@@ -31,6 +31,7 @@ const LoginForm: React.FC<ILoginForm> = ({ children }) => {
 
 				if (resp?.token) {
 					setStatus('success');
+					localStorage.setItem('token', resp.token);
 					login({ token: resp.token, user: resp.user[0] });
 				} else setStatus('error');
 

src/components/layout/header/Logo.tsx

@@ -1,6 +1,7 @@
 import { useActions } from '@/hooks/useActions';
 import { useTypedSelector } from '@/hooks/useTypedSelector';
 import { MenuOutlined } from '@ant-design/icons';
+import Link from 'next/link';
 import styled from 'styled-components';
 
 const StyledLogo = styled.span`
@@ -29,7 +30,9 @@ const Logo = () => {
 				style={{ width: '20px', height: '20px' }}
 				onClick={() => toggleUpperDrawer(!user.upperDrawer)}
 			/>
-			<h3>Shinoki store</h3>
+			<Link href={`/`} style={{ textDecoration: 'none' }}>
+				<h3 style={{ color: 'black', paddingTop: '5px' }}>Оболонь Маркет</h3>
+			</Link>
 		</StyledLogo>
 	);
 };