Skip to content

jield-webdev/solodb-react-components

Repository files navigation

SoloDB React Components

Reusable React components, providers, and hooks for building SoloDB-powered applications. This package extracts common UI and state-management pieces (dashboards, headers, flows, and contexts) into a shareable library.

Features

  • Ready-to-use dashboards and UI elements for Equipment, Monitor, Run, Chemical, Admin, and Service modules
  • Context providers and hooks for authentication and domain state
  • Lightweight runtime configuration via initSolodbComponents
  • TypeScript types exported for key domain entities
  • Example app included for local development and integration testing

Peer dependencies

This library relies on the following peer dependencies in your app:

  • react (19) and react-dom (19)
  • @tanstack/react-query ~5.90
  • @tanstack/react-table ^8

Ensure these are installed in your application. Refer to package.json for the full list and exact versions.

Quick start

  1. Configure the library at app startup (optional but recommended):
import { initSolodbComponents } from "solodb-react-components";

initSolodbComponents({
  // example: baseUrl, feature flags, timezone, etc.
});
  1. Wrap your app with the required providers (e.g., AuthProvider). Use additional domain providers as needed:
import React from "react";
import ReactDOM from "react-dom/client";
import { BrowserRouter } from "react-router-dom";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { AuthProvider, EquipmentProvider } from "@jield/solodb-react-components";

const qc = new QueryClient();

ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
    <QueryClientProvider client={qc}>
      <AuthProvider>
        <EquipmentProvider>
          <BrowserRouter>
            {/* your routes/components */}
          </BrowserRouter>
        </EquipmentProvider>
      </AuthProvider>
    </QueryClientProvider>
  </React.StrictMode>
);

Exports overview

All exports are available from the package root (solodb-react-components):

  • Providers: AuthProvider, EquipmentProvider, StatusMailProvider, MonitorProvider, RunProvider, RunStepProvider, EmphasizedParametersProvider
  • Components (selection):
    • Equipment: SetupUpdateEquipment, GoldsteinEquipmentDashboard, StatusMailComponent, EquipmentDashboard, EquipmentHeaderElement
    • Monitor: MonitorCard, MonitorPage, MonitorHeaderElement
    • Run: RunHeaderElement, RunStepsElement, RunInformationElement, RunStepHeaderElement, RunStepExecuteElement
    • Chemical: ChemicalHeaderElement, ChemicalIntakeElement
    • Admin: GoldsteinClientsDashboard
    • Service: ReportResults
    • Partials: PaginationLinks, InputModal, DateFormat
  • Contexts: AuthContext, EquipmentContext, StatusMailContext, MonitorContext, RunContext, RunStepContext, EmphasizedParametersContext
  • Hooks: useAuth
  • Runtime: initSolodbComponents
  • Types: User, Equipment, Monitor, Run, RunStep

For the complete and up‑to‑date list, see src/index.ts.

Example application

This repository includes an example app showing typical integration.

Run it locally:

# 1) Install and build the library
yarn install
yarn build

# 2) Install and run the example
yarn run example:install
yarn dev

Release

Run the guided release script from the repository root:

yarn release

The script starts from develop, upgrades dependencies, shows the resulting changes, prompts for the next package version, optionally runs tests and a build, commits the release on develop, merges it into main, pushes main, creates an annotated vX.Y.Z tag on main, pushes the tag to GitHub, and switches back to develop.

About

Reusable react components for SoloDB

Resources

Stars

0 stars

Watchers

0 watching

Forks

Packages

 
 
 

Contributors

Languages