react-science 10.0.0 → 11.1.0

package/src/app/panels/measurements/MeasurementsTable.tsx

@@ -1,350 +0,0 @@
-import { Menu, MenuItem, Popover } from '@blueprintjs/core';
-import styled from '@emotion/styled';
-import { useMemo } from 'react';
-
-import type {
-  MeasurementBase,
-  MeasurementKind,
-} from '../../../app-data/index.js';
-import {
-  getMeasurement,
-  useAppDispatch,
-  useAppState,
-} from '../../../app-data/index.js';
-import type { InfoPanelData } from '../../../components/index.js';
-import {
-  Button,
-  ConfirmDialog,
-  InfoPanel,
-  PanelPreferencesToolbar,
-  useOnOff,
-} from '../../../components/index.js';
-import { MeasurementConfigPanel } from '../index.js';
-
-import {
-  MeasurementCheckbox,
-  MeasurementColorPreview,
-  MeasurementSelectedVisibilityChange,
-  MeasurementVisibilityToggle,
-  useMeasurementPanel,
-} from './index.js';
-
-export interface MeasurementsTableProps {
-  kind: MeasurementKind;
-}
-
-interface MeasurementsTableRowProps {
-  item: MeasurementBase;
-  kind: MeasurementsTableProps['kind'];
-}
-
-const MeasurementsTableContainer = styled.div`
-  display: flex;
-  flex-direction: column;
-`;
-
-const MeasurementsTableRoot = styled.table`
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-  border-collapse: collapse;
-  table-layout: fixed;
-`;
-
-const MeasurementsTableHeaderStyled = styled.tr`
-  border-bottom-width: 1px;
-  font-weight: 500;
-  text-align: left;
-  padding-bottom: 10px;
-  padding-top: 10px;
-  padding-left: 2rem;
-`;
-
-const MeasurementsTableBody = styled.tbody`
-  background-color: white;
-`;
-
-const MeasurementsHeaderColumn = styled.div`
-  display: flex;
-  flex-direction: row;
-  gap: 12px;
-  align-items: center;
-  padding-left: 5px;
-  padding-right: 5px;
-  border-bottom: 1px solid black;
-`;
-const MeasurementsHeaderGroup = styled.div`
-  display: flex;
-  gap: 6px;
-`;
-
-const MeasurementsTableRowData = styled.tr`
-  height: 50px;
-  max-height: 50px;
-  overflow: hidden;
-  cursor: pointer;
-  padding-left: 2rem;
-  padding-bottom: 10px;
-  padding-top: 10px;
-  border-bottom-width: 1px;
-
-  font-weight: 500;
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-`;
-
-const MeasurementsIconsContainer = styled.th`
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  justify-items: center;
-  height: 50px;
-  flex-direction: row;
-  cursor: default;
-  gap: 2px;
-  width: 100px;
-`;
-
-export function MeasurementsTable(props: MeasurementsTableProps) {
-  const { kind } = props;
-
-  const {
-    data: { measurements },
-    view: { selectedMeasurements },
-  } = useAppState();
-  const dispatch = useAppDispatch();
-  const [isRemoveDialogOpen, openRemoveDialog, closeRemoveDialog] = useOnOff();
-
-  const hasSelectedMeasurements = (selectedMeasurements[kind]?.length ?? 0) > 0;
-
-  function onRemove() {
-    dispatch({ type: 'REMOVE_SELECTED_MEASUREMENTS', payload: { kind } });
-    closeRemoveDialog();
-  }
-
-  return (
-    <MeasurementsTableContainer>
-      <MeasurementsHeaderColumn>
-        <MeasurementsHeaderGroup>
-          <Button
-            minimal
-            icon="trash"
-            intent="danger"
-            style={{ opacity: hasSelectedMeasurements ? 1 : 0.6 }}
-            onClick={hasSelectedMeasurements ? openRemoveDialog : undefined}
-            tooltipProps={{ content: 'Remove selected', position: 'bottom' }}
-          />
-        </MeasurementsHeaderGroup>
-        <ConfirmDialog
-          headerColor="red"
-          isOpen={isRemoveDialogOpen}
-          onConfirm={onRemove}
-          onClose={closeRemoveDialog}
-          saveText="Remove"
-        >
-          <div style={{ fontWeight: 'bold', padding: 10 }}>
-            Remove selected measurements?
-          </div>
-        </ConfirmDialog>
-      </MeasurementsHeaderColumn>
-
-      <MeasurementsTableRoot>
-        <MeasurementsTableHeader kind={kind} />
-        <MeasurementsTableBody>
-          {measurements[kind].entries.map((element) => (
-            <MeasurementsTableRow key={element.id} item={element} kind={kind} />
-          ))}
-        </MeasurementsTableBody>
-      </MeasurementsTableRoot>
-    </MeasurementsTableContainer>
-  );
-}
-
-const TableHeaderFilename = styled.th`
-  width: 50%;
-`;
-
-const TableHeaderTechnique = styled.th`
-  width: 150px;
-`;
-
-const TableDataHeaderName = styled.td`
-  width: 50%;
-  overflow: hidden;
-`;
-
-function MeasurementsTableHeader({
-  kind,
-}: {
-  kind: MeasurementsTableProps['kind'];
-}) {
-  const {
-    data: { measurements: measurementsData },
-    view: { selectedMeasurements, measurements },
-  } = useAppState();
-  const dispatch = useAppDispatch();
-  function onSelectLink(select: boolean) {
-    dispatch({
-      type: 'SELECT_ALL_MEASUREMENTS',
-      payload: {
-        kind,
-        select,
-      },
-    });
-  }
-  const allSelected = useMemo(
-    () =>
-      selectedMeasurements[kind]?.length ===
-      measurementsData[kind]?.entries.length,
-    [kind, measurementsData, selectedMeasurements],
-  );
-  const selectedVisible = useMemo(() => {
-    const ids = selectedMeasurements[kind];
-    if (ids) {
-      return ids.every((id) => measurements[id]?.visible);
-    }
-    return false;
-  }, [selectedMeasurements, kind, measurements]);
-  return (
-    <thead>
-      <MeasurementsTableHeaderStyled>
-        <MeasurementsIconsContainer
-          style={{
-            paddingLeft: '26px',
-          }}
-        >
-          <MeasurementCheckbox
-            checked={allSelected}
-            onSelectCheckbox={() => {
-              onSelectLink(!allSelected);
-            }}
-          />
-          <MeasurementSelectedVisibilityChange
-            kind={kind}
-            isVisible={selectedVisible}
-          />
-        </MeasurementsIconsContainer>
-        <TableHeaderFilename>Filename</TableHeaderFilename>
-        <TableHeaderTechnique>Technique</TableHeaderTechnique>
-      </MeasurementsTableHeaderStyled>
-    </thead>
-  );
-}
-
-function MeasurementsTableRow(props: MeasurementsTableRowProps) {
-  const { item, kind } = props;
-  const { openPanel } = useMeasurementPanel();
-
-  const {
-    data,
-    view: { selectedMeasurements, measurements },
-  } = useAppState();
-
-  const dispatch = useAppDispatch();
-
-  function onSelectRow() {
-    dispatch({
-      type: 'SELECT_MEASUREMENT',
-      payload: { id: item.id, kind, acc: 'replace' },
-    });
-  }
-
-  function onSelectCheckbox() {
-    const isAlreadyChecked = selectedMeasurements[kind]?.includes(item.id);
-
-    dispatch({
-      type: 'SELECT_MEASUREMENT',
-      payload: { id: item.id, kind, acc: isAlreadyChecked ? 'remove' : 'add' },
-    });
-  }
-  const { info = {}, meta = {} } =
-    getMeasurement(data.measurements, kind, item.id) || {};
-
-  const infoPanelData: InfoPanelData[] = [
-    {
-      description: 'Information',
-      data: info,
-    },
-    {
-      description: 'Metadata',
-      data: meta,
-    },
-  ];
-  const content = (
-    <Menu
-      style={{
-        minWidth: 0,
-      }}
-    >
-      <MenuItem
-        text="Information"
-        icon="info-sign"
-        onClick={() =>
-          openPanel?.({
-            title: item.info.file?.name ?? item.info.title,
-            renderPanel: (props) => (
-              <div>
-                <PanelPreferencesToolbar
-                  title={item.info.file?.name ?? item.info.title}
-                  onClose={() => props.closePanel()}
-                />
-                <InfoPanel data={infoPanelData} title="" />
-              </div>
-            ),
-          })
-        }
-      />
-      <MenuItem
-        text="Configuration"
-        icon="settings"
-        onClick={() =>
-          openPanel?.({
-            title: item.info.file?.name ?? item.info.title,
-            renderPanel: (props) => (
-              <div>
-                <PanelPreferencesToolbar
-                  title={item.info.file?.name ?? item.info.title}
-                  onClose={() => props.closePanel()}
-                />
-                <MeasurementConfigPanel />
-              </div>
-            ),
-          })
-        }
-      />
-    </Menu>
-  );
-
-  return (
-    <MeasurementsTableRowData>
-      <MeasurementsIconsContainer>
-        <Popover content={content} position="bottom-left">
-          <Button
-            minimal
-            icon="more"
-            style={{
-              transform: 'rotate(90deg)',
-            }}
-            small
-          />
-        </Popover>
-        <MeasurementCheckbox
-          checked={selectedMeasurements[kind]?.includes(item.id) || false}
-          onSelectCheckbox={onSelectCheckbox}
-        />
-        <MeasurementVisibilityToggle
-          id={item.id}
-          isVisible={measurements[item.id].visible}
-        />
-        <MeasurementColorPreview
-          measurementId={item.id}
-          kind={kind}
-          color={measurements[item.id].color}
-        />
-      </MeasurementsIconsContainer>
-      <TableDataHeaderName onClick={onSelectRow} title={item.id}>
-        {item.info.file?.name ?? item.info.title}
-      </TableDataHeaderName>
-      <td onClick={onSelectRow}>{item.meta.technique}</td>
-    </MeasurementsTableRowData>
-  );
-}

package/src/app/panels/measurements/index.ts

@@ -1,11 +0,0 @@
-export * from './MeasurementsPanelAccordion.js';
-export * from './MeasurementsPanel.js';
-export * from './MeasurementsTable.js';
-export {
-  type MeasurementState,
-  useMeasurementPanel,
-} from './measurement_panel_context.js';
-export { MeasurementPanelProvider } from './measurement_panel_context.provider.js';
-export * from './MeasurementVisibilityToggle.js';
-export * from './MeasurementCheckbox.js';
-export * from './MeasurementColorPreview.js';

package/src/app/panels/measurements/measurement_panel_context.provider.tsx

@@ -1,18 +0,0 @@
-import type { ReactNode } from 'react';
-
-import type { MeasurementState } from './measurement_panel_context.js';
-import { measurementPanelContext } from './measurement_panel_context.js';
-
-export function MeasurementPanelProvider({
-  children,
-  value,
-}: {
-  children: ReactNode;
-  value: MeasurementState;
-}) {
-  return (
-    <measurementPanelContext.Provider value={value}>
-      {children}
-    </measurementPanelContext.Provider>
-  );
-}

package/src/app/panels/measurements/measurement_panel_context.ts

@@ -1,18 +0,0 @@
-import type { Panel } from '@blueprintjs/core';
-import { createContext, useContext } from 'react';
-
-export interface MeasurementState {
-  openPanel?: (panel: Panel<object>) => void;
-}
-
-export const measurementPanelContext = createContext<MeasurementState>({});
-
-export function useMeasurementPanel() {
-  const context = useContext(measurementPanelContext);
-  if (!context) {
-    throw new Error(
-      'useMeasurementPanel must be used within a MeasurementPanel',
-    );
-  }
-  return context;
-}

package/src/app-data/enhancers/enhance.ts

@@ -1,26 +0,0 @@
-import type { Measurements } from '../index.js';
-import type { MeasurementBase } from '../state/index.js';
-
-export type Enhancer<T extends MeasurementBase> = (data: T) => void;
-
-export type Enhancers = {
-  [mKind in keyof Measurements]: Array<
-    Enhancer<Measurements[mKind]['entries'][number]>
-  >;
-};
-
-export function enhance(
-  measurements: Partial<Measurements>,
-  enhancers: Partial<Enhancers>,
-) {
-  for (const [kind, kindEnhancers] of Object.entries(enhancers)) {
-    const kindMeasurements = measurements[kind as keyof Measurements];
-    if (kindMeasurements) {
-      for (const measurement of kindMeasurements.entries) {
-        for (const enhancer of kindEnhancers) {
-          enhancer(measurement);
-        }
-      }
-    }
-  }
-}

package/src/app-data/enhancers/index.ts

@@ -1 +0,0 @@
-export * from './enhance.js';

package/src/app-data/helpers/index.ts

@@ -1 +0,0 @@
-export * from './variables.js';

package/src/app-data/helpers/variables.ts

@@ -1,29 +0,0 @@
-import type { MeasurementVariable } from 'cheminfo-types';
-
-import type { MeasurementBase } from '../state/index.js';
-
-export function getAllVariableSymbols(measurement: MeasurementBase): string[] {
-  return Object.values(measurement.data[0].variables).map((v) => v.label);
-}
-
-export function getPreferredVariable(
-  measurement: MeasurementBase,
-  axis: 'x' | 'y',
-): MeasurementVariable {
-  if (axis === 'x') {
-    return measurement.data[0].variables.x || measurement.data[0].variables.a;
-  } else {
-    return measurement.data[0].variables.y || measurement.data[0].variables.b;
-  }
-}
-
-export function getVariableByLabel(
-  measurement: MeasurementBase,
-  label: string,
-): MeasurementVariable | null {
-  const variables = measurement.data[0].variables;
-  for (const value of Object.values(variables)) {
-    if (value.label === label) return value;
-  }
-  return null;
-}

package/src/app-data/index.ts

@@ -1,6 +0,0 @@
-export * from './enhancers/index.js';
-export * from './helpers/index.js';
-export * from './kinds/index.js';
-export * from './loaders/index.js';
-export * from './state/index.js';
-export * from './utils.js';

package/src/app-data/kinds/index.ts

@@ -1,2 +0,0 @@
-export * from './ir/index.js';
-export * from './iv/index.js';

package/src/app-data/kinds/ir/IrMeasurement.ts

@@ -1,15 +0,0 @@
-import type { MeasurementBase } from '../../index.js';
-
-import type { IrPeak } from './IrPeak.js';
-
-/**
- * When we have a simple measurement like uv, ir, etc, data should only contain one element
- * Sometimes measurements are more complex like in GC / MS, GC / MS / MS, raman images, etc. In this case we will add the meta and info properties
- * to differentiate each measurement
- * If we have isotherm with gaz absorption / desorption this format should also be used.
- * The 'info'for each 'Measurement' should be normalized.
- */
-
-export interface IrMeasurement extends MeasurementBase {
-  peaks?: IrPeak[];
-}

package/src/app-data/kinds/ir/IrPeak.ts

@@ -1,8 +0,0 @@
-export type IrPeakKind = 'S' | 'w' | 'm';
-
-export interface IrPeak {
-  wavenumber: number;
-  absorbance: number;
-  transmittance: number;
-  kind: IrPeakKind;
-}

package/src/app-data/kinds/ir/index.ts

@@ -1,4 +0,0 @@
-export * from './irAutoPeakPickingEnhancer.js';
-export * from './IrMeasurement.js';
-export * from './irMeasurementEnhancer.js';
-export * from './IrPeak.js';

package/src/app-data/kinds/ir/irAutoPeakPickingEnhancer.ts

@@ -1,94 +0,0 @@
-import type { GSDOptions } from 'ml-gsd';
-import { gsd } from 'ml-gsd';
-import type { Shape1D } from 'ml-peak-shape-generator';
-import { xMinMaxValues } from 'ml-spectra-processing';
-
-import type { IrMeasurement } from './IrMeasurement.js';
-import type { IrPeak, IrPeakKind } from './IrPeak.js';
-
-export interface AutoPeakPickingOptions extends GSDOptions {
-  /** x variable label, by default 'x' */
-  xVariable?: string;
-  /** y variable label, by default 'y' */
-  yVariable?: string;
-  shape?: Shape1D;
-  /** First X value for the peak picking (default: first X value */
-  from?: number;
-  /** Last X value for the peak picking (default: last X value */
-  to?: number;
-  /** Minimal peak width */
-  minPeakWidth?: number;
-}
-
-/** Based on a x value we will return a peak*/
-export function irAutoPeakPickingEnhancer(
-  measurement: IrMeasurement,
-  options: AutoPeakPickingOptions = {},
-) {
-  const { xVariable = 'x', yVariable = 'y', minPeakWidth } = options;
-
-  // we throw if there are more than one spectrum
-  if (measurement.data.length > 1) {
-    throw new Error(
-      'autoPeakPickingEnhancer can only be applied if there is only on measurement data',
-    );
-  }
-  if (measurement.data.length === 0) return;
-
-  const datum = measurement.data[0];
-
-  const x = datum.variables[xVariable]?.data;
-  const y = datum.variables[yVariable]?.data;
-  if (!x || !y) return [];
-
-  const { from, to } = options;
-
-  let peaks: Array<{ x: number; y: number; width: number; index: number }> =
-    gsd({ x, y }, options);
-
-  if (from !== undefined) {
-    peaks = peaks.filter((peak) => peak.x >= from);
-  }
-  if (to !== undefined) {
-    peaks = peaks.filter((peak) => peak.x <= to);
-  }
-  if (minPeakWidth) {
-    peaks = peaks.filter((peak) => peak.width >= minPeakWidth);
-  }
-
-  const minMaxTransmittance = xMinMaxValues(datum.variables.t.data);
-  const results: IrPeak[] = peaks.map((peak) => ({
-    wavenumber: datum.variables.x.data[peak.index],
-    absorbance: datum.variables.a.data[peak.index],
-    transmittance: datum.variables.t.data[peak.index] / 100,
-    kind: getPeakKind(
-      datum.variables.t.data[peak.index],
-      minMaxTransmittance.min,
-      minMaxTransmittance.max,
-    ),
-  }));
-
-  measurement.peaks = results;
-}
-
-export function getIrAutoPeakPickingEnhancer(
-  options: AutoPeakPickingOptions | undefined,
-) {
-  return (measurement: IrMeasurement) =>
-    irAutoPeakPickingEnhancer(measurement, options);
-}
-
-function getPeakKind(
-  transmittance: number,
-  minTransmittance: number,
-  maxTransmittance: number,
-): IrPeakKind {
-  const position =
-    (maxTransmittance - transmittance) / (maxTransmittance - minTransmittance);
-  if (position < 0.33) {
-    return 'w';
-  } else if (position < 0.66) {
-    return 'm';
-  }
-  return 'S';
-}

package/src/app-data/kinds/ir/irMeasurementEnhancer.ts

@@ -1,51 +0,0 @@
-import type { MeasurementBase } from '../../index.js';
-
-/**
- * we add missing absorbance / transmittance
- * variable a = absorbance
- * variable t = transmittance
- */
-
-export function irMeasurementEnhancer(measurement: MeasurementBase) {
-  for (const datum of measurement.data) {
-    const variables = datum.variables;
-    const yVariable = variables.y;
-    let absorbance = true;
-    if (yVariable.label.toLowerCase().includes('trans')) {
-      absorbance = false;
-    }
-
-    if (absorbance) {
-      variables.a = { ...yVariable };
-      variables.a.data = variables.a.data.slice();
-      variables.t = {
-        data: yVariable.data.map((absorbance) => 10 ** -absorbance * 100),
-        label: 'Transmittance (%)',
-        units: '',
-      };
-    } else {
-      const factor =
-        yVariable.label.includes('%') ||
-        yVariable.label.toLowerCase().includes('percent')
-          ? 100
-          : 1;
-      variables.a = {
-        data: yVariable.data.map(
-          (transmittance) => -Math.log10(transmittance / factor),
-        ),
-        label: 'Absorbance',
-        units: '',
-      };
-      if (factor === 100) {
-        variables.t = { ...yVariable };
-        variables.t.data = variables.t.data.slice();
-      } else {
-        variables.t = {
-          units: '',
-          label: 'Transmittance (%)',
-          data: yVariable.data.map((transmittance) => transmittance * 100),
-        };
-      }
-    }
-  }
-}

package/src/app-data/kinds/iv/IvMeasurement.ts

@@ -1,3 +0,0 @@
-import type { MeasurementBase } from '../../index.js';
-
-export type IvMeasurement = MeasurementBase;

package/src/app-data/kinds/iv/index.ts

@@ -1 +0,0 @@
-export * from './IvMeasurement.js';