Staggering features to anonymous users

import { VaModal } from '@department-of-veterans-affairs/component-library/dist/react-bindings';
import React from 'react';
import { useStaggeredFeatureRelease } from '@department-of-veterans-affairs/platform-utilities/react-hooks';

function StaggeredFeatureExample() {
  // Release this feature to 75% of anonymous users.
  const PERCENT_OF_ANON_USERS = 75;

  // Provide a value for the localStorage key used by
  // useStaggeredFeatureRelease().
  const LOCAL_STORAGE_KEY = 'use-staggered-release-react-hook-example';

  // Instantiate the hook. The hook will return a boolean that can be used in
  // decisions.
  const viewModal = useStaggeredFeatureRelease(
    PERCENT_OF_ANON_USERS,
    LOCAL_STORAGE_KEY,
  );

  // Renders a modal if viewModal is true.
  return (
    <>
      {viewModal && (
        <VaModal
          role="dialog"
          cssClass="va-modal announcement-brand-consolidation"
          visible
          id="modal-announcement"
          modalTitle="An example of the useStaggeredFeatureRelease React hook."
        >
          <p>This modal displays for 75% of users.</p>
        </VaModal>
      )}
    </>
  );
}

export default StaggeredFeatureExample;