@memfault/cdr-renderer-toolkit

@memfault/cdr-renderer-toolkit

A toolkit to build React applications meant to be rendered inside an iframe within Memfault that can render special or proprietary Custom Data Recordings.

Usage

import React from "react";
import { useFragmentData } from "@memfault/cdr-renderer-toolkit";

function App() {
  const { data, error, isLoading, isExampleData, isExpired } = useFragmentData({
    exampleDownloadUrl: "/path/to/example-data.bin",
  });

  if (isLoading) return <div>Loading...</div>;
  if (error) return <div>Error: {error}</div>;

  return (
    <div>
      {isExampleData && <p>Using example data</p>}
      {isExpired && <p>Download URL has expired</p>}
      <p>
        Data size: {data ? `${data.byteLength} bytes` : "No data available"}
      </p>
    </div>
  );
}

Development

Using the Nix package manager

Install Nix and direnv and run:

cp .envrc.example .envrc
direnv allow
yarn
yarn build

If you don't want to use direnv, you can also do the following:

nix develop
yarn
yarn build

Using other package managers

Install system dependencies:

• biomejs: ^1.9.4
• node: ^20.18.0
• yarn: ^1.22

Bootstrap and build:

yarn
yarn build

Running tests

yarn test

Publishing

yarn build
npm login
npm publish