// File Path: monorepo/native/desktop/maplefile/frontend/src/pages/User/FileManager/Collections/CollectionShare.jsx
import { Link, useParams } from "react-router-dom";
import Navigation from "../../../../components/Navigation";
import Page from "../../../../components/Page";
import "../../Dashboard/Dashboard.css";

function CollectionShare() {
  const { collectionId } = useParams();

  return (
    <div className="layout">
      <Navigation />
      <div className="main-content">
        <Page
          title={`Share Collection (${collectionId})`}
          showBackButton={true}
        >
          <p>Share this collection with other users.</p>
          <h3>Sharing Options</h3>
          <div className="nav-buttons">
            <Link
              to={`/file-manager/collections/${collectionId}`}
              className="nav-button success"
            >
              Share (Read Only)
            </Link>
            <Link
              to={`/file-manager/collections/${collectionId}`}
              className="nav-button success"
            >
              Share (Read/Write)
            </Link>
            <Link
              to={`/file-manager/collections/${collectionId}`}
              className="nav-button success"
            >
              Share (Admin)
            </Link>
            <Link
              to={`/file-manager/collections/${collectionId}`}
              className="nav-button secondary"
            >
              Cancel
            </Link>
          </div>
        </Page>
      </div>
    </div>
  );
}

export default CollectionShare;
