|
|
|
|
@ -2,17 +2,18 @@ import React, { useEffect, useState } from "react";
|
|
|
|
|
|
|
|
|
|
import { useParams } from "react-router-dom"; |
|
|
|
|
import firebase from "firebase/app"; |
|
|
|
|
import { Button, CircularProgress, Fade } from "@mui/material"; |
|
|
|
|
|
|
|
|
|
import ArrowForwardIcon from "@mui/icons-material/ArrowForward"; |
|
|
|
|
import ArrowBackIcon from "@mui/icons-material/ArrowBack"; |
|
|
|
|
import IconButton from "@mui/material/IconButton"; |
|
|
|
|
import { Stack } from "@mui/system"; |
|
|
|
|
import logoSrc from "./logo_chat.svg"; |
|
|
|
|
import { Fade } from "@mui/material"; |
|
|
|
|
|
|
|
|
|
export const Galleria = () => { |
|
|
|
|
const { evento } = useParams(); |
|
|
|
|
const [messaggi, cambiaMessaggi] = useState([]); |
|
|
|
|
const [loading, cambialoading] = useState(false); |
|
|
|
|
|
|
|
|
|
const [indiceCorrente, cambiaindiceCorrente] = useState(1); |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
@ -84,7 +85,7 @@ export const Galleria = () => {
|
|
|
|
|
<ArrowBackIcon style={{ fontSize: "3rem" }} /> |
|
|
|
|
</IconButton> |
|
|
|
|
)} |
|
|
|
|
{indiceCorrente > 0 && ( |
|
|
|
|
{indiceCorrente < messaggi.length && ( |
|
|
|
|
<IconButton |
|
|
|
|
onClick={() => cambiaindiceCorrente(indiceCorrente + 1)} |
|
|
|
|
> |
|
|
|
|
@ -142,6 +143,8 @@ function ImagePlaceholder({ messaggioDaMostrare }) {
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const Messaggio = ({ messaggioDaMostrare }) => { |
|
|
|
|
const date = new Date(messaggioDaMostrare.timestamp); |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<> |
|
|
|
|
<h1 |
|
|
|
|
@ -166,6 +169,9 @@ const Messaggio = ({ messaggioDaMostrare }) => {
|
|
|
|
|
da {messaggioDaMostrare.autore} |
|
|
|
|
</p> |
|
|
|
|
)} |
|
|
|
|
<p style={{ fontFamily: "sans-serif", fontSize: ".8rem", color: "#333" }}> |
|
|
|
|
{date.toLocaleString("it-IT")} |
|
|
|
|
</p> |
|
|
|
|
</> |
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|
|