Skip to content

Commit

Permalink
Merge pull request #32 from NwinNwin/dang_auth_firebase
Browse files Browse the repository at this point in the history
Dang final touch b4 aif
  • Loading branch information
NwinNwin authored Sep 25, 2023
2 parents f86aa13 + 574a304 commit 61cc85a
Show file tree
Hide file tree
Showing 16 changed files with 266 additions and 99 deletions.
10 changes: 10 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@
"react": "^18.2.0",
"react-calendar": "^4.6.0",
"react-dom": "^18.2.0",
"react-ga": "^3.3.1",
"react-icons": "^4.10.1",
"react-leaflet": "^4.2.1",
"react-resizable": "^3.0.5",
Expand Down
4 changes: 3 additions & 1 deletion src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,9 @@ import { ChakraProvider } from "@chakra-ui/react";
import "leaflet/dist/leaflet.css";
import { AuthContextProvider } from "./context/AuthContext";
import AboutPage from "./components/AboutPage/AboutPage";
//
import ReactGA from "react-ga";

ReactGA.initialize("UA-283774176-1");
function App() {
return (
<AuthContextProvider>
Expand Down
7 changes: 5 additions & 2 deletions src/components/AboutPage/AboutPage.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,17 @@ import "swiper/css/navigation";
import logo from "../../assets/images/small_logo.png";
import login_page from "../../assets/images/login_page.jpg";
import axios from "axios";
import ReactGA from "react-ga";

export default function AboutPage() {
const navigate = useNavigate();
const [screenWidth, setScreenWidth] = useState(window.screen.width);
const [data, setData] = useState([]);
const [leaderboard, setLeaderboard] = useState([]);
console.log("leaderboard", leaderboard);
console.log("data", data);

useEffect(() => {
ReactGA.pageview(window.location.pathname);
}, []);

window.onresize = () => {
setScreenWidth(window.screen.width);
Expand Down
39 changes: 29 additions & 10 deletions src/components/FeedbackModal/FeedbackModal.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,26 @@ export default function FeedbackModal({
email,
}) {
const [feedbackHelped, setFeedbackHelped] = useState(null);
const { setLoading } = useContext(DataContext);
const { setLoading, token } = useContext(DataContext);
async function handleFeedback() {
if (!token) {
return;
}
setLoading(false);
axios
.put(`${process.env.REACT_APP_AWS_BACKEND_URL}/items/${props.id}`, {
...props,
isresolved: true,
ishelped: feedbackHelped,
})
.put(
`${process.env.REACT_APP_AWS_BACKEND_URL}/items/${props.id}`,
{
...props,
isresolved: true,
ishelped: feedbackHelped,
},
{
headers: {
Authorization: `Bearer ${token}`, // verify auth
},
}
)
.then(() => console.log("Success"))
.catch((err) => console.log(err));

Expand All @@ -51,10 +62,18 @@ export default function FeedbackModal({
// Update the leaderboard
const pointsToAdd = props.islost ? 2 : 5;

axios.put(`${process.env.REACT_APP_AWS_BACKEND_URL}/leaderboard`, {
email: email,
pointsToAdd: pointsToAdd,
});
axios.put(
`${process.env.REACT_APP_AWS_BACKEND_URL}/leaderboard`,
{
email: email,
pointsToAdd: pointsToAdd,
},
{
headers: {
Authorization: `Bearer ${token}`, // verify auth
},
}
);

setLeaderboard((prev) =>
prev.map((u) =>
Expand Down
31 changes: 30 additions & 1 deletion src/components/Filter/Filter.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,11 @@ import {
Button,
} from "@chakra-ui/react";
import "./Filter.css";
import { UserAuth } from "../../context/AuthContext";

export default function Filter({ findFilter, setFindFilter, onClose, isOpen }) {
const [value, setValue] = useState("everything");
const { user } = UserAuth();

useEffect(() => {
/* eslint-disable react-hooks/exhaustive-deps */
Expand Down Expand Up @@ -70,20 +72,42 @@ export default function Filter({ findFilter, setFindFilter, onClose, isOpen }) {
Found
</Text>
</Flex>
<Flex mb="20px">
<Switch
colorScheme="yellow"
size="lg"
onChange={() => {
setFindFilter((prev) => ({
...prev,
isShowReturned: !prev.isShowReturned,
}));
}}
defaultChecked={findFilter.isShowReturned}
/>
<Text mb="0px" ml="50px" fontSize="xl">
Returned
</Text>
</Flex>

<Flex mb="15px">
<Switch
colorScheme="blue"
size="lg"
defaultChecked={findFilter.isYourPosts}
isDisabled={!user}
onChange={() => {
setFindFilter((prev) => ({
...prev,
isYourPosts: !prev.isYourPosts,
}));
}}
/>
<Text mb="0px" ml="50px" fontSize="xl">
<Text
mb="0px"
ml="50px"
fontSize="xl"
color={!user && "gray"}
>
Your Posts
</Text>
</Flex>
Expand Down Expand Up @@ -124,6 +148,9 @@ export default function Filter({ findFilter, setFindFilter, onClose, isOpen }) {
</Stack>
</RadioGroup>
</Box>
<Text fontSize="xl" fontWeight="bold" mt="15px">
Found/Lost Date:
</Text>
<Input
onChange={(e) => {
setFindFilter((prev) => ({
Expand All @@ -149,6 +176,8 @@ export default function Filter({ findFilter, setFindFilter, onClose, isOpen }) {
isFound: true,
islost: true,
uploadDate: "",
isYourPosts: false,
isShowReturned: true,
});
onClose();
}}
Expand Down
35 changes: 27 additions & 8 deletions src/components/Home/Home.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@ export default function Home() {
const [data, setData] = useState([]);
const [leaderboard, setLeaderboard] = useState([]);
const { user, logOut } = UserAuth();
const [token, setToken] = useState("");
const btnRef = useRef();

const { isOpen, onOpen, onClose } = useDisclosure();
Expand All @@ -74,6 +75,7 @@ export default function Home() {
islost: true,
uploadDate: "",
isYourPosts: false,
isShowReturned: true,
});

function isFilterOff() {
Expand All @@ -83,10 +85,13 @@ export default function Home() {
findFilter.islost === true &&
findFilter.uploadDate === "" &&
search === "" &&
!findFilter.isYourPosts
!findFilter.isYourPosts &&
findFilter.isShowReturned === true
);
}

console.log(token);

const [loading, setLoading] = useState(false);

const [newAddedItem, setNewAddedItem] = useState({
Expand Down Expand Up @@ -157,22 +162,24 @@ export default function Home() {
setLeaderboard(
leaderboardData.map((item) => ({ ...item, id: item.id }))
);

// Check if the current user's email exists in the leaderboard
const userEmailExists = leaderboardData.some(
(entry) => entry.email === user?.email
);

// If it does not exist, add the user to the leaderboard
if (!userEmailExists) {
await axios.post(
`${process.env.REACT_APP_AWS_BACKEND_URL}/leaderboard/`,
{
email: user.email,
points: 5, // You can modify this as per your requirements
},
{
headers: {
Authorization: `Bearer ${token}`, // verify auth
},
}
);

// Fetch the leaderboard again after insertion
const { data: updatedLeaderboardData } = await axios.get(
`${process.env.REACT_APP_AWS_BACKEND_URL}/leaderboard/`
Expand All @@ -189,6 +196,13 @@ export default function Home() {
};

getLeaderboard();
}, [user, token]);

// set token to auth
useEffect(() => {
if (user) {
setToken(user.accessToken);
}
}, [user]);

window.onresize = () => {
Expand All @@ -199,6 +213,7 @@ export default function Home() {
<DataContext.Provider
value={{
data: data,
token: token,
setLoading: setLoading,
isLoginModalOpen: isLoginModalOpen,
onLoginModalClose: onLoginModalClose,
Expand Down Expand Up @@ -303,7 +318,7 @@ export default function Home() {
gap={{ base: 1, md: 1.5 }}
justifyContent={"center"}
background={"#74a2fa"}
padding={{ base: "6px", md: 1.5 }}
padding={{ base: "5px", md: 1.5 }}
borderRadius={"xl"}
_hover={{
background: "#365fad",
Expand All @@ -317,10 +332,14 @@ export default function Home() {
<Image
ref={btnRef}
src={cookie}
h={{ base: "20px", md: "20px" }}
w={{ base: "25px", md: "25px" }}
h={{ base: "15px", md: "20px" }}
w={{ base: "15px", md: "25px" }}
/>
<Text as={"b"} fontSize={"lg"} color={"white"}>
<Text
as={"b"}
fontSize={{ base: "sm", md: "lg" }}
color={"white"}
>
{user
? leaderboard.find((u) => u.email === user.email)?.points
: 0}
Expand Down
32 changes: 16 additions & 16 deletions src/components/Home/Leaderboard.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ export default function Leaderboard({
<Flex
w={{ base: "100%", md: "500px" }}
padding={5}
px={5}
px={{ base: 3, md: 5 }}
background={"#5c5be5"}
color={"white"}
alignItems={"center"}
Expand All @@ -81,26 +81,27 @@ export default function Leaderboard({
<Text as={"b"} fontSize={"4xl"}>
1
</Text>
<Text as={"b"} fontSize={"lg"}>
<Text as={"b"} fontSize={{ base: "sm", md: "lg" }}>
{leaderboard[0]?.email}
</Text>
</Flex>

<Flex>
<Text as={"b"} fontSize={"4xl"}>
<Flex alignItems={"center"}>
<Text as={"b"} fontSize={{ base: "3xl", md: "4xl" }}>
{leaderboard[0]?.points}
</Text>
<Image
class="gold-medal"
src={goldmedal}
alt="gold medal"
w={"5vh"}
h={"5vh"}
/>
</Flex>
</Flex>
<Flex
w={{ base: "100%", md: "500px" }}
padding={5}
px={5}
p={{ base: 3, md: 5 }}
background={"white"}
color={"black"}
alignItems={"center"}
Expand All @@ -112,21 +113,20 @@ export default function Leaderboard({
<Text as={"b"} fontSize={"4xl"}>
2
</Text>
<Text as={"b"} fontSize={"lg"}>
{leaderboard[0]?.email}
<Text as={"b"} fontSize={{ base: "sm", md: "lg" }}>
{leaderboard[1]?.email}
</Text>
</Flex>

<Flex>
<Text as={"b"} fontSize={"4xl"}>
{leaderboard[0]?.points} 🍪
<Text as={"b"} fontSize={{ base: "3xl", md: "4xl" }}>
{leaderboard[1]?.points} 🍪
</Text>
</Flex>
</Flex>
<Flex
w={{ base: "100%", md: "500px" }}
padding={5}
px={5}
p={{ base: 3, md: 5 }}
background={"white"}
color={"black"}
alignItems={"center"}
Expand All @@ -138,14 +138,14 @@ export default function Leaderboard({
<Text as={"b"} fontSize={"4xl"}>
3
</Text>
<Text as={"b"} fontSize={"lg"}>
{leaderboard[0]?.email}
<Text as={"b"} fontSize={{ base: "sm", md: "lg" }}>
{leaderboard[2]?.email}
</Text>
</Flex>

<Flex>
<Text as={"b"} fontSize={"4xl"}>
{leaderboard[0]?.points} 🍪
<Text as={"b"} fontSize={{ base: "3xl", md: "4xl" }}>
{leaderboard[2]?.points} 🍪
</Text>
</Flex>
</Flex>
Expand Down
2 changes: 1 addition & 1 deletion src/components/ImageContainer/ImageContainer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export default function ImageContainer({ image, isresolved }) {
alignItems={"center"}
marginTop={30}
flexDir={"column"}
w={450}
w={{ base: "100vw", md: 450 }}
>
<Text fontSize={18} as="b" color={"white"}>
RETURNED
Expand Down
Loading

0 comments on commit 61cc85a

Please sign in to comment.