mirror of https://github.com/Qortal/q-tube
GitHub
15 changed files with 564 additions and 382 deletions
@ -1,17 +1,17 @@
|
||||
import ReactDOM from 'react-dom/client' |
||||
import App from './App' |
||||
import './index.css' |
||||
import { BrowserRouter } from 'react-router-dom' |
||||
import ReactDOM from "react-dom/client"; |
||||
import App from "./App"; |
||||
import "./index.css"; |
||||
import { BrowserRouter } from "react-router-dom"; |
||||
interface CustomWindow extends Window { |
||||
_qdnBase: string
|
||||
_qdnBase: string; |
||||
} |
||||
|
||||
const customWindow = window as unknown as CustomWindow |
||||
const customWindow = window as unknown as CustomWindow; |
||||
|
||||
const baseUrl = customWindow?._qdnBase || '' |
||||
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( |
||||
const baseUrl = customWindow?._qdnBase || ""; |
||||
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render( |
||||
<BrowserRouter basename={baseUrl}> |
||||
<App /> |
||||
<div id="modal-root" /> |
||||
</BrowserRouter> |
||||
) |
||||
); |
||||
|
||||
@ -1,65 +1,74 @@
|
||||
import React, { useMemo } from 'react' |
||||
import { VideoListComponentLevel } from '../Home/VideoListComponentLevel' |
||||
import { HeaderContainer, ProfileContainer } from './Profile-styles' |
||||
import { AuthorTextComment, StyledCardColComment, StyledCardHeaderComment } from '../VideoContent/VideoContent-styles' |
||||
import { Avatar, Box, useTheme } from '@mui/material' |
||||
import { useParams } from 'react-router-dom' |
||||
import { useSelector } from 'react-redux' |
||||
import { setUserAvatarHash } from '../../state/features/globalSlice' |
||||
import { RootState } from '../../state/store' |
||||
import React, { useMemo } from "react"; |
||||
import { VideoListComponentLevel } from "../Home/VideoListComponentLevel"; |
||||
import { HeaderContainer, ProfileContainer } from "./Profile-styles"; |
||||
import { |
||||
AuthorTextComment, |
||||
StyledCardColComment, |
||||
StyledCardHeaderComment, |
||||
} from "../VideoContent/VideoContent-styles"; |
||||
import { Avatar, Box, useTheme } from "@mui/material"; |
||||
import { useParams } from "react-router-dom"; |
||||
import { useSelector } from "react-redux"; |
||||
import { setUserAvatarHash } from "../../state/features/globalSlice"; |
||||
import { RootState } from "../../state/store"; |
||||
import { SubscribeButton } from "../../components/common/SubscribeButton.tsx"; |
||||
|
||||
export const IndividualProfile = () => { |
||||
const { name: paramName } = useParams() |
||||
const { name: paramName } = useParams(); |
||||
|
||||
const userAvatarHash = useSelector( |
||||
(state: RootState) => state.global.userAvatarHash |
||||
) |
||||
const theme = useTheme() |
||||
); |
||||
const theme = useTheme(); |
||||
|
||||
|
||||
|
||||
const avatarUrl = useMemo(()=> { |
||||
let url = '' |
||||
if(paramName && userAvatarHash[paramName]){ |
||||
url = userAvatarHash[paramName] |
||||
const avatarUrl = useMemo(() => { |
||||
let url = ""; |
||||
if (paramName && userAvatarHash[paramName]) { |
||||
url = userAvatarHash[paramName]; |
||||
} |
||||
|
||||
return url |
||||
}, [userAvatarHash, paramName]) |
||||
return url; |
||||
}, [userAvatarHash, paramName]); |
||||
return ( |
||||
<ProfileContainer> |
||||
<HeaderContainer> |
||||
<Box sx={{ |
||||
cursor: 'pointer' |
||||
}} > |
||||
<Box |
||||
sx={{ |
||||
cursor: "pointer", |
||||
}} |
||||
> |
||||
<StyledCardHeaderComment |
||||
sx={{ |
||||
'& .MuiCardHeader-content': { |
||||
overflow: 'hidden' |
||||
} |
||||
"& .MuiCardHeader-content": { |
||||
overflow: "hidden", |
||||
}, |
||||
}} |
||||
> |
||||
<Box> |
||||
<Avatar src={`/arbitrary/THUMBNAIL/${paramName}/qortal_avatar`} alt={`${paramName}'s avatar`} /> |
||||
<Avatar |
||||
src={`/arbitrary/THUMBNAIL/${paramName}/qortal_avatar`} |
||||
alt={`${paramName}'s avatar`} |
||||
/> |
||||
</Box> |
||||
<StyledCardColComment> |
||||
<AuthorTextComment |
||||
color={ |
||||
theme.palette.mode === 'light' |
||||
theme.palette.mode === "light" |
||||
? theme.palette.text.secondary |
||||
: '#d6e8ff' |
||||
: "#d6e8ff" |
||||
} |
||||
> |
||||
{paramName} |
||||
</AuthorTextComment> |
||||
</StyledCardColComment> |
||||
<SubscribeButton name={paramName} sx={{marginLeft:'10px'}}/> |
||||
<SubscribeButton |
||||
subscriberName={paramName} |
||||
sx={{ marginLeft: "10px" }} |
||||
/> |
||||
</StyledCardHeaderComment> |
||||
</Box> |
||||
</HeaderContainer> |
||||
<VideoListComponentLevel /> |
||||
</ProfileContainer> |
||||
|
||||
) |
||||
} |
||||
); |
||||
}; |
||||
|
||||
Loading…
Reference in new issue