Skip to content

Commit

Permalink
Merge pull request #8 from Aut-Labs/main
Browse files Browse the repository at this point in the history
changes
  • Loading branch information
AntGe authored May 30, 2024
2 parents 9eb8385 + e78d23f commit 8c9d121
Show file tree
Hide file tree
Showing 16 changed files with 1,630 additions and 49 deletions.
563 changes: 558 additions & 5 deletions package-lock.json

Large diffs are not rendered by default.

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,7 @@
"@testing-library/user-event": "~14.5.2",
"axios": "^1.6.7",
"buffer": "^6.0.3",
"canvas": "^2.11.2",
"clsx": "^2.1.0",
"d3-force": "^3.0.0",
"date-fns": "^3.3.1",
Expand Down Expand Up @@ -90,7 +91,8 @@
"swiper": "^11.0.5",
"util": "^0.12.5",
"viem": "^2.7.1",
"wagmi": "^2.5.5"
"wagmi": "^2.5.5",
"xmldom": "^0.6.0"
},
"devDependencies": {
"@types/jest": "~29.5.11",
Expand Down
2 changes: 1 addition & 1 deletion public/index.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>The Nova Hub</title>
<title>The Hub Showcase</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
Expand Down
37 changes: 37 additions & 0 deletions src/components/Oauth2/oauth2.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,12 @@ const cleanup = (intervalRef, popupRef, handleMessageListener) => {
window.removeEventListener("message", handleMessageListener);
};

const xCleanUp = (xIntervalRef) => {
if (xIntervalRef.current) {
clearInterval(xIntervalRef.current);
}
};

export const useOAuth = () => {
const [authenticating, setAuthenticating] = useState(false);
const [finsihedFlow, setFinishedFlow] = useState(false);
Expand Down Expand Up @@ -102,6 +108,7 @@ export const useOAuthSocials = () => {
const [finsihedFlow, setFinishedFlow] = useState(false);
const popupRef = useRef<Window>();
const intervalRef = useRef<ReturnType<typeof setInterval>>();
const xIntervalRef = useRef<ReturnType<typeof setInterval>>();

const getAuthDiscord = useCallback(async (onSuccess, onFailure) => {
setAuthenticating(true);
Expand Down Expand Up @@ -182,6 +189,7 @@ export const useOAuthSocials = () => {
if (error) {
onFailure(error);
} else {
xCleanUp(xIntervalRef);
const response = await axios.post(
`${environment.apiUrl}/autID/config/oauth2AccessTokenX`,
{
Expand Down Expand Up @@ -217,9 +225,38 @@ export const useOAuthSocials = () => {
}
}, 550);

xIntervalRef.current = setInterval(async () => {
const oauthResponse = JSON.parse(localStorage.getItem("OAUTH_RESPONSE"));
if (oauthResponse) {
cleanup(intervalRef, popupRef, handleMessageListener);
localStorage.removeItem("OAUTH_RESPONSE");
try {
if (oauthResponse.error) {
onFailure(oauthResponse.error);
} else {
const response = await axios.post(
`${environment.apiUrl}/autID/config/oauth2AccessTokenX`,
{
code: oauthResponse.payload.code,
callbackUrl
}
);
setAuthenticating(false);
popupRef.current.close();
onSuccess(response.data);
xCleanUp(xIntervalRef);
}
} catch (genericError) {
onFailure(genericError);
console.error(genericError);
}
}
}, 550);

return () => {
setAuthenticating(false);
cleanup(intervalRef, popupRef, handleMessageListener);
xCleanUp(xIntervalRef);
};
}, []);

Expand Down
201 changes: 164 additions & 37 deletions src/pages/Nova/NovaDetails.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { memo, useEffect, useMemo, useRef } from "react";
import { memo, useEffect, useMemo, useRef, useState } from "react";
import {
Avatar,
Box,
Expand All @@ -23,7 +23,8 @@ import {
useCheckHasMintedForNovaQuery,
ArchetypeTypes,
useGetAllNovasQuery,
useGetNovaTasksQuery
useGetNovaTasksQuery,
communityApi
} from "@api/community.api";
import { ipfsCIDToHttpUrl } from "@api/storage.api";
import { ReactComponent as DiscordIcon } from "@assets/SocialIcons/DiscordIcon.svg";
Expand All @@ -47,6 +48,7 @@ import { setNovaAddress } from "@store/WalletProvider/WalletProvider";
import { MarketTemplates } from "@api/community.model";
import AutLoading from "@components/AutLoading";
import { filterActiveNovas } from "./utils";
import { generateAutIdDAOSigil } from "@utils/AutSIgilGenerator/SigilGenerator";

const socialIcons = {
discord: DiscordIcon,
Expand All @@ -56,6 +58,28 @@ const socialIcons = {
lensfrens: LensfrensIcon
};

const calculateFontSize = (name: string) => {
const words = name.split(" ");
const longestWordLength = Math.max(...words.map((word) => word.length));
if (longestWordLength >= 22) {
return "0.85rem !important";
} else if (longestWordLength >= 20) {
return "0.95rem !important";
} else if (longestWordLength >= 18) {
return "1.05rem !important";
} else if (longestWordLength >= 16) {
return "1.15rem !important";
} else if (longestWordLength >= 14) {
return "1.25rem !important";
} else if (longestWordLength >= 12) {
return "1.35rem !important";
} else if (longestWordLength >= 10) {
return "1.45rem !important";
} else {
return "";
}
};

const AutContainer = styled("div")(({ theme }) => ({
display: "flex",
height: "100%",
Expand Down Expand Up @@ -255,6 +279,18 @@ const NovaDetails = () => {
});
}, [data, novaName, address]);

const [sigil, setSigil] = useState<string | null>(null);

useEffect(() => {
const generate = async () => {
const { toBase64 } = await generateAutIdDAOSigil(nova.properties.address);
setSigil(toBase64());
};
if (nova) {
generate();
}
}, []);

const {
data: result,
isLoading: checkingIfMinted,
Expand Down Expand Up @@ -333,7 +369,12 @@ const NovaDetails = () => {
// };
}, []);

const onMinted = async (event: CustomEvent) => {
dispatch(communityApi.util.invalidateTags(["hasMinted"]));
};

useEffect(() => {
window.addEventListener("aut-minted", onMinted);
// window.addEventListener("aut_profile", onAutMenuProfile);
// window.addEventListener("aut-Init", onAutInit);
// window.addEventListener("aut-onConnected", onAutLogin);
Expand All @@ -347,6 +388,7 @@ const NovaDetails = () => {
// if (abort.current) {
// abort.current.abort();
// }
window.removeEventListener("aut-minted", onMinted);
};
}, []);

Expand Down Expand Up @@ -403,59 +445,143 @@ const NovaDetails = () => {
justifyContent: "center"
}}
>
<Avatar
<Box
sx={{
flex: "1",
height: {
xs: "120px",
sm: "120px",
md: "120px",
xxl: "130px"
},
borderRadius: "0",
width: {
xs: "120px",
sm: "120px",
md: "120px",
xxl: "130px"
},
background: "transparent"
"@media (max-width: 370px)": {
height: "100px",
width: "100px"
},
minWidth: "120px",
position: "relative"
}}
aria-label="avatar"
>
<img
src={ipfsCIDToHttpUrl(nova?.image as string)}
style={{
objectFit: "contain",
<Avatar
sx={{
width: "100%",
height: "100%"
}}
/>
</Avatar>
{/* TODO: Implement when nova sigil is available */}
{/* {nova?.sigil && typeof nova?.sigil == "string" && (
<Box
sx={{
position: "absolute",
cursor: "pointer",
bottom: "-20px",
left: "100px",
transform: "rotate(7deg)",
height: {
xs: "130px",
md: "140px",
xxl: "140px"
}
}}
>
<img
style={{
height: "100%",
width: "100%"
borderRadius: "0",
background: "transparent"
}}
aria-label="card"
src={ipfsCIDToHttpUrl(nova?.sigil as string)}
/>
aria-label="avatar"
>
<img
src={ipfsCIDToHttpUrl(nova?.image as string)}
style={{
objectFit: "contain",
width: "100%",
height: "100%"
}}
/>
</Avatar>

{sigil && (
<Box
sx={{
position: "absolute",
bottom: {
xs: "-15px",
sm: "-15px",
md: "-17.5px",
xxl: "-10px"
},
right: {
xs: "10px",
sm: "10px",
md: "-17.5px",
xxl: "-17.5px"
},
"@media (max-width: 584px)": {
right: "5px"
},
"@media (max-width: 520px)": {
right: "-5px"
},
"@media (max-width: 480px)": {
right: "-15px"
},
height: {
xs: "35px",
sm: "35px",
md: "40px",
xxl: "40px"
},
width: {
xs: "35px",
sm: "35px",
md: "40px",
xxl: "40px"
},
backgroundColor: "transparent",
backdropFilter: "blur(8px)",
borderRadius: "8px",
display: "flex",
justifyContent: "center",
alignItems: "center",
padding: "8px",
zIndex: 1
}}
>
<img
style={{
transform: "scale(1.8)",
height: "100%",
width: "100%",
objectFit: "contain"
}}
aria-label="card"
src={sigil}
/>
</Box>
)}
</Box>
)} */}

{/* {sigil && (
<Box
sx={{
position: "absolute",
bottom: {
xs: "-17.5px",
md: "-20px",
xxl: "-22.5px"
},
right: { xs: "-17.5px", md: "-20px", xxl: "-22.5px" },
height: { xs: "35px", md: "40px", xxl: "45px" },
width: { xs: "35px", md: "40px", xxl: "45px" },
backgroundColor: "rgba(255, 255, 255, 0.05)",
backdropFilter: "blur(8px)",
borderRadius: "8px",
display: "flex",
justifyContent: "center",
alignItems: "center",
padding: "8px",
boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
}}
>
<img
style={{
transform: "scale(1.6)",
height: "100%",
width: "100%",
objectFit: "contain"
}}
aria-label="card"
src={sigil}
/>
</Box>
)} */}
<div
style={{
flex: "1",
Expand All @@ -471,6 +597,7 @@ const NovaDetails = () => {
lineHeight={1}
variant="h3"
marginBottom={2}
fontSize={calculateFontSize(nova?.name as string)}
>
{nova?.name}
</Typography>
Expand Down
3 changes: 2 additions & 1 deletion src/pages/Nova/ToolbarConnector.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { useAppDispatch } from "@store/store.model";
import { communityApi } from "@api/community.api";
import { environment } from "@api/environment";

export const TOOLBAR_HEIGHT = 84;
export const TOOLBAR_HEIGHT = 70;

export const ToolbarConnector = () => {
const { isConnected, disconnect } = useAutConnector({
Expand All @@ -32,6 +32,7 @@ export const ToolbarConnector = () => {
sx={{
width: "100%",
zIndex: 99,
opacity: 0.9,
position: "fixed",
top: 0,
backgroundColor: "nightBlack.main",
Expand Down
Loading

0 comments on commit 8c9d121

Please sign in to comment.