import React from "react";
import { useNavigate, useLocation } from "react-router";
import { UIMCButton } from "@ui-marcom/react/button";
import { navigateWithTransition } from "../../utils/viewTransition";
import "./ValuePartnership.scss";

/**
 * "Value Partnership" presentation app - placeholder page until its content
 * exists. Only functional element is the fixed "Apps" button back to "/".
 */
export const ValuePartnershipPage = () => {
  const navigate = useNavigate();
  const { search } = useLocation();

  return (
    <div className="value-partnership-page page">
      <h1>Value Partnership</h1>
      <p>Placeholder - content follows.</p>

      {/* this page has no SlideNavigation yet - without this button it would
          be a dead end with no way back to the app selection */}
      <UIMCButton
        className="value-partnership__apps-button"
        variant="standard"
        title="Apps"
        onClick={() => navigateWithTransition(navigate, `/${search}`)}>
        Apps
      </UIMCButton>
    </div>
  );
};