How can one display Firebase Cloud Firestore data in multiple pages?

I have rows of cards containing data that is being fetched from Firestore. Below is an image of this page.

https://i.stack.imgur.com/X2bhO.jpg

Here is the code for this page:

import React, { useEffect, useState } from 'react'
import { Button, Card, Col, Form, FormLabel, Modal, Row } from 'react-bootstrap';
import app from '../firebase'
import { BsChevronRight } from 'react-icons/bs'
import { Link } from "react-router-dom";

function Polis() {
    const [politicians, setPolis] = useState([]);
    const [loading, setLoading] = useState(false);

    const [show, setShow] = useState(false);
    const handleClose = () => setShow(false);
    const handleShow = () => setShow(true);

    const ref = app.firestore().collection("politicians");
   
    function getPolis() {
        setLoading(true);
        ref.onSnapshot((querySnapshot) => {
            const items = [];
            querySnapshot.forEach((doc) => {
                items.push(doc.data());
            });
            setPolis(items);
            setLoading(false);
        });
    }

    useEffect(() => {
        getPolis();
    }, []);

    if (loading) {
        return <h1>Loading...</h1>;
    }

/*
    function party_icon() {
        if (politician.party='Democrat') {
          return <FaDemocrat />;
        } else {
        return <FaRepublican />;
      }
    }
*/
    return (
        <div min-width= {100}>
            <h1>Nassau County Politicians</h1>
            <Card>
                <Card.Title>
                    <Form
                        
                    >
                        <FormLabel>Search</FormLabel>
                    </Form>
                </Card.Title>
            </Card>
            <Row xs={2} md={5} lg={8}>
                {politicians.map((politician) => (
                    <Col>
                        <Card 
                            style={{ width: '15rem' }}
                            key={politician.id}
                            >
                            <Card.Img src={politician.img} />
                            <Card.Body>
                                <Card.Title>{politician.name}</Card.Title>
                                <Card.Text>
                                    <h6>{politician.position}</h6>
                                    <h6>{politician.party}</h6>
                                    {/*<h6>{this.party_icon(politician.party)}</h6>*/}
                                    <Link to="/poliprofile">
                                        <Button
                                            variant='primary'
                                            onClick={handleShow}
                                        >
                                            <BsChevronRight></BsChevronRight>
                                        </Button>
                                    </Link>
                                </Card.Text>
                            </Card.Body>
                        </Card>
                    </Col>
                ))}
            </Row>
        </div>
    );
}

export default Polis;

The buttons route to another page that acts as the profile page for the politician whose button has been clicked on. Here's the code for that so far:

import React from "react";
import Polis from "./Polis";
import { Card } from 'react-bootstrap';

function PoliProfile() {
     return (
        <Card 
        style={{ width: '15rem' }}
        >
        <Card.Img src={"https://static.vecteezy.com/system/resources/previews/002/318/271/non_2x/user-profile-icon-free-vector.jpg"} />
        <Card.Body>
            <Card.Title>{"Name"}</Card.Title>
            <Card.Text>
                <h2>{"Position"}</h2>
                <h3>{"Party"}</h3>
                {/*<h6>{this.party_icon(politician.party)}</h6>*/}
            </Card.Text>
        </Card.Body>
    </Card>
     );
 }

 export default PoliProfile;

Is there a way to take the data from the first page and display it on the second page as well? I know i have to import the first page but I'm not sure how much other code pertaining to Firebase from the first file I'm supposed to be re-using.