function DiffItem()

in packages-ext/recoil-devtools/src/pages/Popup/Items/DiffItem.js [44:83]


function DiffItem({
  name,
  startCollapsed = false,
  isRoot = false,
}: Props): React.Node {
  const connection = nullthrows(useContext(ConnectionContext));
  const [txID] = useSelectedTransaction();

  const {tree, dependencies} = connection;
  const {value, previous} = useMemo(
    () => ({
      value: tree.get(name, txID),
      previous: tree.get(name, txID - 1),
    }),
    [tree, txID, name],
  );

  return (
    <CollapsibleItem
      key={name}
      isRoot={isRoot}
      label={
        <>
          <ItemLabel
            name={name}
            node={connection.getNode(name)}
            isRoot={isRoot}
          />
          <ItemDescription content={value} previous={previous} />
        </>
      }
      startCollapsed={startCollapsed}>
      <div style={styles.valuesHolder}>
        <JsonDiff left={formatForDiff(previous)} right={formatForDiff(value)} />
      </div>
      <ItemMoreItems content={value} />
      <ItemDependencies name={name} />
    </CollapsibleItem>
  );
}