@audio-intakes/shared v0.28.11

Getting started

For contributors

Visit our Wiki to see how to contribute.

For consumers

About

This is a shared library exclusively intended for developers working at Audio Intakes (@audio-intakes).

It includes configs, contexts, custom hooks and utility functions all consumed by Audio Intakes UI components (Library, Editor, Recorder, Player).

Versions

Latest:

Documentation

Installation

This is a public scoped package of the audio-intakes NPM organization.

npm i @audio-intakes/shared

or

yarn add @audio-intakes/shared

Importing

A configuration file

import { themeNames } from "@audio-intakes/shared";

A Context

Importing Context Provider

import { TokenProvider } from "@audio-intakes/shared";

Importing useContext function

import { useToken } from "@audio-intakes/shared";

A hook

import { useIsFirstRender } from "@audio-intakes/shared";

A component

import { AudioSpectrum } from "@audio-intakes/shared";

A utility Function

import { validateTheme } from "@audio-intakes/shared";

Usage

A configuration constant

// Get all themes with light keyword
const arr = themeNames.map((t) => t.includes("light"));

A Context

Using Imported Context Provider

const Demo = () => {
  const jwtToken = "MY_JWT_TOKEN";
  return (
    <TokenProvider token={jwtToken}>
      <Consuming_Component />
    </TokenProvider>
  );
};

Using Imported useContext function

const tokenValue = useToken();

A hook

const isMount = useIsFirstRender();

A component

const Demo = (props) => {
  return (
    <AudioSpectrum {...props} />
  );
};

A utility Function

const themeName = "light";
const validatedTheme = validateTheme(themeName);

Configs

• API
• Initializing i8next
• Google Analytics
• Sentry : App monitoring and tracking

Contexts

• Response Context
• Questionnaire Context
• Question Context
• Answer Context
• Customer Context
• Token Context
• ResourceID Context
• Device Context

Utils

• Download answers
• Helper functions
• Input and output sources
• Settings
• Validators

Hooks

Inspiration:

Some inspirational repositories to keep tracking for new ideas:

react-hooks: https://react-hooks.org\ rooks: https://github.com/imbhargav5/rooks\ react-use: https://github.com/streamich/react-use

Hooks:

• useBrowserStorage
• useDeviceDetect
• useGaTracker
• useGeoLocation
• useIsFirstRender
• useMetaData
• useOnOutsideClick
• useResizeContainer
• useScreenOrientation
• useCustomAudioWaves
• useAudioPlayer