@ta-interaktiv/utils

A collection of utility functions often used in our projects.

Functions

useGlobalState<T>(key: string, initialValue: T | (() => T))

A React hook that mimics useState but stores state globally on the window object. This allows state to be shared across different micro-frontends or components.

Parameters:

• key (string): A unique key to identify this piece of state in the global store
• initialValue (T | (() => T)): The initial value for the state if not already set globally

Returns: [T, (newValue: T | ((prevValue: T) => T)) => void] - A stateful value and a function to update it

Example:

import { useGlobalState } from "@ta-interaktiv/utils";

const [globalCount, setGlobalCount] = useGlobalState('count', 0);

getStickyHeaderHeight()

Get the height of the sticky header of DISCO.

Returns: number - The height of the sticky header if it is sticky, 0 otherwise

Example:

import { getStickyHeaderHeight } from "@ta-interaktiv/utils";

const headerHeight = getStickyHeaderHeight();

scrollIntoView(element: HTMLElement, bottom?: boolean)

Scroll into view with adjustment to the sticky navigation bar.

Parameters:

• element (HTMLElement): Element to scroll to
• bottom (boolean, optional): If true, align the bottom of the element to the bottom of the window

Example:

import { scrollIntoView } from "@ta-interaktiv/utils";

const targetElement = document.getElementById('target');
if (targetElement) {
  scrollIntoView(targetElement, false);
}

formatNumber(number: number | string)

Format a number to a string with thousands separators. Uses comma as decimal separator and apostrophe as thousands separator for numbers above 10,000.

Parameters:

• number (number | string): Number to format

Returns: string - Formatted number string

Example:

import { formatNumber } from "@ta-interaktiv/utils";

formatNumber(12345.67); // Returns "12'345,67"
formatNumber(123); // Returns "123"

getArticleId(overrideUrl?: string)

Get the article id from the URL by extracting the number from the last segment after the last hyphen.

Parameters:

• overrideUrl (string, optional): Optional URL to override the current URL

Returns: number | undefined - The article ID or undefined if not found

Example:

import { getArticleId } from "@ta-interaktiv/utils";

// For URL: https://example.com/article-title-12345
getArticleId(); // Returns 12345

// With custom URL
getArticleId('https://example.com/another-article-67890'); // Returns 67890