@stack-spot/portal-components 1.5.1 → 2.0.0

package/src/components/Tour/utils.tsx

@@ -1,100 +0,0 @@
-import { theme } from '@stack-spot/portal-theme'
-import { ReactNode } from 'react'
-import { ReactourStep } from 'reactour'
-import { getCookie, setCookie } from '../../utils/cookie'
-import { PointingArrowPosition, StepContainer } from './StepContainer'
-import { NavigationProps } from './StepNavigation'
-
-const TOUR_COOKIE = 'guided-tour-global'
-
-const defaultExpires = new Date()
-defaultExpires.setFullYear(new Date().getFullYear() + 1)
-
-const getTourCookie = () => {
-  const currentTourObject = getCookie(TOUR_COOKIE)
-  return currentTourObject ? currentTourObject.split(',') : []
-}
-
-/**
- * Tutorial: marks the tour step as finished. This sets a cookie, preventing the tour from showing again.
- * @param key the identifier for the step to mark as finished.
- */
-export const finishTourStep = (key: string) => {
-  const finishedTours: string[] = getTourCookie()
-  if (!finishedTours.includes(key)) finishedTours.push(key)
-  setCookie(TOUR_COOKIE, finishedTours.toString(), { expires: defaultExpires.toUTCString() })
-}
-
-/**
- * Tutorial: verifies if the React Tour step has not finished yet.
- * 
- * A step has not finished if the array stored as a cookie doesn't include the string value of `step.selector`.
- * @param step the step config.
- * @returns true if the step has not yet been marked as finished. False otherwise.
- */
-export const isNewTourStep = (step: ReactourStep) => !hasFinishedTourStep(`${step.selector}`)
-
-/**
- * Tutorial: verifies if the key passed as parameter refers to a React Tour step that has already finished.
- * 
- * The key refers to a finished step if the array stored as a cookie includes it.
- * If the cookie is set to 'disabled', then the step will be considered finished.Particularly useful in scenarios like e2e tests.
- * @param key the step's identifier to check.
- * @returns true if the key refers to a finished step. False otherwise.
- */
-export const hasFinishedTourStep = (key: string) => {
-  const tourCookie = getTourCookie()
-  return tourCookie.includes(key) || tourCookie[0] === 'disabled'
-}
-
-interface StackspotTourStep extends ReactourStep {
-  /**
-   * The step's title.
-   */
-  title: string,
-  /**
-   * The unique identifier for the step (key).
-   */
-  selector: string,
-  /**
-   * The step's content.
-   */
-  content: ReactNode,
-  /**
-   * A set of properties for customizing the next and previous buttons.
-   */
-  customNavigation?: NavigationProps,
-}
-
-/**
- * Tutorial: utility for building a React Tour step. This already includes some default configuration for tours in Stackspot.
- * @param options the options for building the step: {@link StackspotTourStep}. 
- * @returns the React Tour step.
- */
-export const tourStepBuilder = ({
-  selector,
-  position,
-  title,
-  content,
-  style,
-  customNavigation,
-  ...rest
-}: StackspotTourStep): ReactourStep => ({
-  selector,
-  content: (<StepContainer
-    stepKey={selector}
-    position={position as PointingArrowPosition}
-    title={title}
-    customNavigation={customNavigation}>
-    {content}
-  </StepContainer>),
-  position,
-  style: {
-    backgroundColor: theme.color.inverse[500],
-    width: '256px',
-    padding: 0,
-    top: ['right', 'left'].includes(position as PointingArrowPosition) ? '-3px' : '0',
-    ...(style || {}),
-  },
-  ...(rest || {}),
-})