yawaflua/SusMarket
1
0
Fork 0
mirror of https://github.com/yawaflua/SusMarket.git synced 2025-12-08 19:49:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added button for logout account in profile page

Browse Source
This commit is contained in:
RailTH
2024-05-20 20:16:09 +11:00
parent 219de322c4
commit 77a2364ece
12 changed files with 43 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
reactapp/build/asset-manifest.json
View File

@@ -1,7 +1,7 @@
{
"files": {
"main.css": "/static/css/main.1aa814f6.css",
"main.js": "/static/js/main.bd48089b.js",
"main.css": "/static/css/main.a416014f.css",
"main.js": "/static/js/main.16df1775.js",
"static/media/scam-image.png": "/static/media/scam-image.c6c14289dc251ba2d2b1.png",
"static/media/info-page__railth-avatar.png": "/static/media/info-page__railth-avatar.cbf11c43b5ef243b38c0.png",
"static/media/add.webp": "/static/media/add.cd69f1e2a8c91109db0f.webp",
@@ -9,15 +9,16 @@
"static/media/info-page__no-kesspen-avatar.png": "/static/media/info-page__no-kesspen-avatar.baa74b50e31a8363436b.png",
"static/media/share-icon.svg": "/static/media/share-icon.078e541564f15a9740537cec6baba9ab.svg",
"static/media/profile-avatar.svg": "/static/media/profile-avatar.1823777d20902d836fddbbcbc324756f.svg",
"static/media/logout-icon.svg": "/static/media/logout-icon.edc99b580ff0f8975b05fdac4e38046c.svg",
"static/media/review-form__add-image-icon.svg": "/static/media/review-form__add-image-icon.16aa2699eed6b58147903dc5b785d709.svg",
"static/media/rating__star-icon.svg": "/static/media/rating__star-icon.73718a24d04eb67f5873.svg",
"static/media/rating__filled-star-icon.svg": "/static/media/rating__filled-star-icon.dc7d908d4d943b7f3b56.svg",
"index.html": "/index.html",
"main.1aa814f6.css.map": "/static/css/main.1aa814f6.css.map",
"main.bd48089b.js.map": "/static/js/main.bd48089b.js.map"
"main.a416014f.css.map": "/static/css/main.a416014f.css.map",
"main.16df1775.js.map": "/static/js/main.16df1775.js.map"
},
"entrypoints": [
"static/css/main.1aa814f6.css",
"static/js/main.bd48089b.js"
"static/css/main.a416014f.css",
"static/js/main.16df1775.js"
]
}

2
reactapp/build/index.html
View File

@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><title>SusMarket</title><link rel="manifest" href="/manifest.json"/><script defer="defer" src="/static/js/main.bd48089b.js"></script><link href="/static/css/main.1aa814f6.css" rel="stylesheet"></head><body><div id="root"></div></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><title>SusMarket</title><link rel="manifest" href="/manifest.json"/><script defer="defer" src="/static/js/main.16df1775.js"></script><link href="/static/css/main.a416014f.css" rel="stylesheet"></head><body><div id="root"></div></body></html>

4
reactapp/build/static/css/main.1aa814f6.css → reactapp/build/static/css/main.a416014f.css
View File

File diff suppressed because one or more lines are too long

2
reactapp/build/static/css/main.1aa814f6.css.map → reactapp/build/static/css/main.a416014f.css.map
View File

File diff suppressed because one or more lines are too long

6
reactapp/build/static/js/main.bd48089b.js → reactapp/build/static/js/main.16df1775.js
View File

File diff suppressed because one or more lines are too long

0
reactapp/build/static/js/main.bd48089b.js.LICENSE.txt → reactapp/build/static/js/main.16df1775.js.LICENSE.txt
View File

1
reactapp/build/static/js/main.16df1775.js.map Normal file
View File

File diff suppressed because one or more lines are too long

1
reactapp/build/static/js/main.bd48089b.js.map
View File

File diff suppressed because one or more lines are too long

1
reactapp/build/static/media/logout-icon.edc99b580ff0f8975b05fdac4e38046c.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="48px" viewBox="0 -960 960 960" width="48px" fill="#cc2e2e"><path d="M180-120q-24 0-42-18t-18-42v-600q0-24 18-42t42-18h269q12.75 0 21.38 8.68 8.62 8.67 8.62 21.5 0 12.82-8.62 21.32-8.63 8.5-21.38 8.5H180v600h269q12.75 0 21.38 8.68 8.62 8.67 8.62 21.5 0 12.82-8.62 21.32-8.63 8.5-21.38 8.5H180Zm545-330H390q-12.75 0-21.37-8.68-8.63-8.67-8.63-21.5 0-12.82 8.63-21.32 8.62-8.5 21.37-8.5h333l-81-81q-9-9-8.5-21t9.5-21q9-9 21.5-9t21.5 9l133 133q9 9 9 21t-9 21L687-326q-8.8 9-20.9 8.5-12.1-.5-21.49-9.5-8.61-9-8.61-21.5t9-21.5l80-80Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 583 B

8
reactapp/src/ProfileStyle.scss
View File

@@ -7,7 +7,7 @@ $accent-color: #EB5E28;
min-height: 100%;
display: flex;
flex-direction: column;
align-items: center;
align-items: flex-start;
gap: 20px;
.profile-page__nav {
@@ -44,7 +44,6 @@ $accent-color: #EB5E28;
.orders-section {
width: 100%;
min-height: 100%;
display: flex;
flex-direction: column;
gap: 20px;
@@ -119,7 +118,6 @@ $accent-color: #EB5E28;
.purchases-section {
width: 100%;
min-height: 100%;
display: flex;
flex-direction: column;
gap: 20px;
@@ -134,4 +132,8 @@ $accent-color: #EB5E28;
}
}
}
.profile-page__logout-button {
width: 48px;
}
}

1
reactapp/src/assets/icons/logout-icon.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="48px" viewBox="0 -960 960 960" width="48px" fill="#cc2e2e"><path d="M180-120q-24 0-42-18t-18-42v-600q0-24 18-42t42-18h269q12.75 0 21.38 8.68 8.62 8.67 8.62 21.5 0 12.82-8.62 21.32-8.63 8.5-21.38 8.5H180v600h269q12.75 0 21.38 8.68 8.62 8.67 8.62 21.5 0 12.82-8.62 21.32-8.63 8.5-21.38 8.5H180Zm545-330H390q-12.75 0-21.37-8.68-8.63-8.67-8.63-21.5 0-12.82 8.63-21.32 8.62-8.5 21.37-8.5h333l-81-81q-9-9-8.5-21t9.5-21q9-9 21.5-9t21.5 9l133 133q9 9 9 21t-9 21L687-326q-8.8 9-20.9 8.5-12.1-.5-21.49-9.5-8.61-9-8.61-21.5t9-21.5l80-80Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 583 B

23
reactapp/src/pages/ProfilePage.tsx
View File

@@ -1,11 +1,22 @@
import React from "react";
import Banner from "../components/AdBanner";
import { motion } from "framer-motion";
import '../ProfileStyle.scss';
import { Route, Routes } from "react-router-dom";
import { Route, Routes, useNavigate } from "react-router-dom";
import ProfileOrders from "../components/ProfileOrders";
import ProfilePurchases from "../components/ProfilePurchases";
import LogoutIcon from "../assets/icons/logout-icon.svg";
import Cookies from "js-cookie";
export default function ProfilePage() {
const navigate = useNavigate();
const handleLogout = () => {
Cookies.remove('user');
Cookies.remove('user_id');
navigate('/');
}
return(
<section className="profile-page">
<Banner />
@@ -13,6 +24,14 @@ export default function ProfilePage() {
<Route path="/" element={<ProfileOrders/>}/>
<Route path="purchases" element={<ProfilePurchases/>}/>
</Routes>
<motion.button
className="profile-page__logout-button"
whileTap={{scale: 0.9}}
transition={{duration: 0.2, type: "spring"}}
onClick={handleLogout}
>
<img src={LogoutIcon} alt="Logout icon" />
</motion.button>
</section>
)
}
}