new release #190
@ -36,6 +36,8 @@ const PdfItem = ({
|
|||||||
return file.pages?.map((page, i) => {
|
return file.pages?.map((page, i) => {
|
||||||
return (
|
return (
|
||||||
<PdfPageItem
|
<PdfPageItem
|
||||||
|
fileName={file.name}
|
||||||
|
pageIndex={i}
|
||||||
page={page}
|
page={page}
|
||||||
key={i}
|
key={i}
|
||||||
currentUserMarks={filterByPage(currentUserMarks, i)}
|
currentUserMarks={filterByPage(currentUserMarks, i)}
|
||||||
|
@ -7,6 +7,8 @@ import pdfViewStyles from './style.module.scss'
|
|||||||
import { FONT_SIZE, FONT_TYPE, inPx } from '../../utils/pdf.ts'
|
import { FONT_SIZE, FONT_TYPE, inPx } from '../../utils/pdf.ts'
|
||||||
import { useScale } from '../../hooks/useScale.tsx'
|
import { useScale } from '../../hooks/useScale.tsx'
|
||||||
interface PdfPageProps {
|
interface PdfPageProps {
|
||||||
|
fileName: string
|
||||||
|
pageIndex: number
|
||||||
currentUserMarks: CurrentUserMark[]
|
currentUserMarks: CurrentUserMark[]
|
||||||
handleMarkClick: (id: number) => void
|
handleMarkClick: (id: number) => void
|
||||||
otherUserMarks: Mark[]
|
otherUserMarks: Mark[]
|
||||||
@ -19,6 +21,8 @@ interface PdfPageProps {
|
|||||||
* Responsible for rendering a single Pdf Page and its Marks
|
* Responsible for rendering a single Pdf Page and its Marks
|
||||||
*/
|
*/
|
||||||
const PdfPageItem = ({
|
const PdfPageItem = ({
|
||||||
|
fileName,
|
||||||
|
pageIndex,
|
||||||
page,
|
page,
|
||||||
currentUserMarks,
|
currentUserMarks,
|
||||||
handleMarkClick,
|
handleMarkClick,
|
||||||
@ -38,7 +42,11 @@ const PdfPageItem = ({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`image-wrapper ${styles.pdfImageWrapper}`}>
|
<div className={`image-wrapper ${styles.pdfImageWrapper}`}>
|
||||||
<img draggable="false" src={page.image} />
|
<img
|
||||||
|
draggable="false"
|
||||||
|
src={page.image}
|
||||||
|
alt={`page ${pageIndex + 1} of ${fileName}`}
|
||||||
|
/>
|
||||||
{currentUserMarks.map((m, i) => (
|
{currentUserMarks.map((m, i) => (
|
||||||
<div key={i} ref={(el) => (markRefs.current[m.id] = el)}>
|
<div key={i} ref={(el) => (markRefs.current[m.id] = el)}>
|
||||||
<PdfMarkItem
|
<PdfMarkItem
|
||||||
|
@ -42,6 +42,16 @@ export const ProfilePage = () => {
|
|||||||
const [isLoading, setIsLoading] = useState(true)
|
const [isLoading, setIsLoading] = useState(true)
|
||||||
const [loadingSpinnerDesc] = useState('Fetching metadata')
|
const [loadingSpinnerDesc] = useState('Fetching metadata')
|
||||||
|
|
||||||
|
const profileName =
|
||||||
|
pubkey &&
|
||||||
|
profileMetadata &&
|
||||||
|
truncate(
|
||||||
|
profileMetadata.display_name || profileMetadata.name || hexToNpub(pubkey),
|
||||||
|
{
|
||||||
|
length: 16
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (npub) {
|
if (npub) {
|
||||||
try {
|
try {
|
||||||
@ -166,7 +176,10 @@ export const ProfilePage = () => {
|
|||||||
className={`${styles.banner} ${!profileMetadata || !profileMetadata.banner ? styles.noImage : ''}`}
|
className={`${styles.banner} ${!profileMetadata || !profileMetadata.banner ? styles.noImage : ''}`}
|
||||||
>
|
>
|
||||||
{profileMetadata && profileMetadata.banner ? (
|
{profileMetadata && profileMetadata.banner ? (
|
||||||
<img src={profileMetadata.banner} />
|
<img
|
||||||
|
src={profileMetadata.banner}
|
||||||
|
alt={`banner image for ${profileName}`}
|
||||||
|
/>
|
||||||
) : (
|
) : (
|
||||||
''
|
''
|
||||||
)}
|
)}
|
||||||
@ -186,6 +199,7 @@ export const ProfilePage = () => {
|
|||||||
<img
|
<img
|
||||||
className={styles['image-placeholder']}
|
className={styles['image-placeholder']}
|
||||||
src={getProfileImage(profileMetadata!)}
|
src={getProfileImage(profileMetadata!)}
|
||||||
|
alt={profileName}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</Box>
|
</Box>
|
||||||
@ -225,14 +239,7 @@ export const ProfilePage = () => {
|
|||||||
variant="h6"
|
variant="h6"
|
||||||
className={styles.bold}
|
className={styles.bold}
|
||||||
>
|
>
|
||||||
{truncate(
|
{profileName}
|
||||||
profileMetadata.display_name ||
|
|
||||||
profileMetadata.name ||
|
|
||||||
hexToNpub(pubkey),
|
|
||||||
{
|
|
||||||
length: 16
|
|
||||||
}
|
|
||||||
)}
|
|
||||||
</Typography>
|
</Typography>
|
||||||
)}
|
)}
|
||||||
</Box>
|
</Box>
|
||||||
|
@ -106,7 +106,11 @@ const SlimPdfView = ({
|
|||||||
})
|
})
|
||||||
return (
|
return (
|
||||||
<div className="image-wrapper" key={i}>
|
<div className="image-wrapper" key={i}>
|
||||||
<img draggable="false" src={page.image} />
|
<img
|
||||||
|
draggable="false"
|
||||||
|
src={page.image}
|
||||||
|
alt={`page ${i} of ${file.name}`}
|
||||||
|
/>
|
||||||
{marks.map((m) => {
|
{marks.map((m) => {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
Loading…
Reference in New Issue
Block a user