atom.io 0.19.0 → 0.19.1

package/react-devtools/src/AtomIODevtools.tsx

@@ -53,7 +53,7 @@ export const AtomIODevtools = (): JSX.Element => {
 								borderColor: `#0000`,
 								maxHeight: 28,
 								maxWidth: 33,
-						  }
+							}
 				}
 			>
 				{devtoolsAreOpen ? (
@@ -65,6 +65,7 @@ export const AtomIODevtools = (): JSX.Element => {
 									<button
 										key={viewOption}
 										type="button"
+										data-testid={`view-${viewOption}`}
 										className={viewOption === devtoolsView ? `active` : ``}
 										onClick={() => setDevtoolsView(viewOption)}
 										disabled={viewOption === devtoolsView}

package/react-devtools/src/Button.tsx

@@ -5,10 +5,12 @@ export const OpenClose: FC<{
 	isOpen: boolean
 	setIsOpen: (next: Modify<boolean> | boolean) => void
 	disabled?: boolean
-}> = ({ isOpen, setIsOpen, disabled }) => {
+	testid: string
+}> = ({ isOpen, setIsOpen, disabled, testid }) => {
 	return (
 		<button
 			type="button"
+			data-testid={testid}
 			className={`carat ${isOpen ? `open` : `closed`}`}
 			onClick={() => setIsOpen((isOpen) => !isOpen)}
 			disabled={disabled}

package/react-devtools/src/StateEditor.tsx

@@ -3,9 +3,7 @@ import { useI, useO } from "atom.io/react"
 import type { FC } from "react"
 
 import { fallback } from "~/packages/anvl/src/function"
-import { Join } from "~/packages/anvl/src/join"
 import { isJson } from "~/packages/anvl/src/refinement"
-import { RelationEditor } from "~/packages/hamr/react-data-designer/src"
 import { ElasticInput } from "~/packages/hamr/react-elastic-input/src"
 import { JsonEditor } from "~/packages/hamr/react-json-editor/src"
 
@@ -16,19 +14,20 @@ export const StateEditor: FC<{
 	const data = useO(token)
 	return isJson(data) ? (
 		<JsonEditor data={data} set={set} schema={true} />
-	) : data instanceof Join ? (
-		<RelationEditor data={data} set={set} />
 	) : (
 		<div className="json_editor">
 			<ElasticInput
 				value={
-					data instanceof Set
-						? `Set { ${JSON.stringify([...data]).slice(1, -1)} }`
-						: data instanceof Map
-						  ? `Map ` + JSON.stringify([...data])
-						  : Object.getPrototypeOf(data).constructor.name +
-							  ` ` +
-							  fallback(() => JSON.stringify(data), `?`)
+					data !== null &&
+					typeof data === `object` &&
+					`toJson` in data &&
+					typeof data.toJson === `function`
+						? JSON.stringify(data.toJson())
+						: data instanceof Set
+							? `Set { ${JSON.stringify([...data]).slice(1, -1)} }`
+							: Object.getPrototypeOf(data).constructor.name +
+								` ` +
+								fallback(() => JSON.stringify(data), `?`)
 				}
 				disabled={true}
 			/>
@@ -53,11 +52,9 @@ export const ReadonlySelectorViewer: FC<{
 				value={
 					data instanceof Set
 						? `Set ` + JSON.stringify([...data])
-						: data instanceof Map
-						  ? `Map ` + JSON.stringify([...data])
-						  : Object.getPrototypeOf(data).constructor.name +
-							  ` ` +
-							  JSON.stringify(data)
+						: Object.getPrototypeOf(data).constructor.name +
+							` ` +
+							JSON.stringify(data)
 				}
 				disabled={true}
 			/>

package/react-devtools/src/StateIndex.tsx

@@ -1,9 +1,10 @@
 import type {
+	AtomToken,
 	ReadonlySelectorToken,
 	RegularAtomToken,
 	WritableSelectorToken,
 } from "atom.io"
-import { getState, selectorFamily } from "atom.io"
+import { findState, getState, selectorFamily } from "atom.io"
 import type { FamilyNode, WritableTokenIndex } from "atom.io/introspection"
 import { useI, useO } from "atom.io/react"
 import type { FC } from "react"
@@ -34,8 +35,8 @@ const findStateTypeState = selectorFamily<string, { key: string }>({
 
 export const StateIndexLeafNode: FC<{
 	node:
+		| AtomToken<unknown>
 		| ReadonlySelectorToken<unknown>
-		| RegularAtomToken<unknown>
 		| WritableSelectorToken<unknown>
 	isOpenState: RegularAtomToken<boolean>
 	typeState: ReadonlySelectorToken<string>
@@ -53,6 +54,7 @@ export const StateIndexLeafNode: FC<{
 			<header>
 				<button.OpenClose
 					isOpen={isOpen && !isPrimitive}
+					testid={`open-close-state-${node.key}`}
 					setIsOpen={setIsOpen}
 					disabled={isPrimitive}
 				/>
@@ -63,7 +65,7 @@ export const StateIndexLeafNode: FC<{
 					<h2>{node.family?.subKey ?? node.key}</h2>
 					<span className="type detail">({stateType})</span>
 				</label>
-				{isPrimitive ? <StoreEditor token={node} /> : null}
+				<StoreEditor token={node} />
 			</header>
 			{isOpen && !isPrimitive ? (
 				<main>
@@ -75,8 +77,8 @@ export const StateIndexLeafNode: FC<{
 }
 export const StateIndexTreeNode: FC<{
 	node: FamilyNode<
+		| AtomToken<unknown>
 		| ReadonlySelectorToken<unknown>
-		| RegularAtomToken<unknown>
 		| WritableSelectorToken<unknown>
 	>
 	isOpenState: RegularAtomToken<boolean>
@@ -84,13 +86,17 @@ export const StateIndexTreeNode: FC<{
 	const setIsOpen = useI(isOpenState)
 	const isOpen = useO(isOpenState)
 	for (const [key, childNode] of recordToEntries(node.familyMembers)) {
-		findViewIsOpenState(key)
-		findStateTypeState(childNode)
+		findState(findViewIsOpenState, key)
+		findState(findStateTypeState, childNode)
 	}
 	return (
 		<>
 			<header>
-				<button.OpenClose isOpen={isOpen} setIsOpen={setIsOpen} />
+				<button.OpenClose
+					isOpen={isOpen}
+					testid={`open-close-state-family-${node.key}`}
+					setIsOpen={setIsOpen}
+				/>
 				<label>
 					<h2>{node.key}</h2>
 					<span className="type detail"> (family)</span>
@@ -101,10 +107,10 @@ export const StateIndexTreeNode: FC<{
 						<StateIndexNode
 							key={key}
 							node={childNode}
-							isOpenState={findViewIsOpenState(childNode.key)}
-							typeState={findStateTypeState(childNode)}
+							isOpenState={findState(findViewIsOpenState, childNode.key)}
+							typeState={findState(findStateTypeState, childNode)}
 						/>
-				  ))
+					))
 				: null}
 		</>
 	)
@@ -112,18 +118,15 @@ export const StateIndexTreeNode: FC<{
 
 export const StateIndexNode: FC<{
 	node: WritableTokenIndex<
+		| AtomToken<unknown>
 		| ReadonlySelectorToken<unknown>
-		| RegularAtomToken<unknown>
 		| WritableSelectorToken<unknown>
 	>[string]
 	isOpenState: RegularAtomToken<boolean>
 	typeState: ReadonlySelectorToken<string>
 }> = ({ node, isOpenState, typeState }) => {
-	if (node.key.startsWith(`👁‍🗨`)) {
-		return null
-	}
 	return (
-		<section className="node state">
+		<section className="node state" data-testid={`state-${node.key}`}>
 			{`type` in node ? (
 				<StateIndexLeafNode
 					node={node}
@@ -140,15 +143,15 @@ export const StateIndexNode: FC<{
 export const StateIndex: FC<{
 	tokenIndex: ReadonlySelectorToken<
 		WritableTokenIndex<
+			| AtomToken<unknown>
 			| ReadonlySelectorToken<unknown>
-			| RegularAtomToken<unknown>
 			| WritableSelectorToken<unknown>
 		>
 	>
 }> = ({ tokenIndex }) => {
 	const tokenIds = useO(tokenIndex)
 	return (
-		<article className="index state_index">
+		<article className="index state_index" data-testid="state-index">
 			{Object.entries(tokenIds)
 				.filter(([key]) => !key.startsWith(`👁‍🗨`))
 				.sort()
@@ -157,8 +160,8 @@ export const StateIndex: FC<{
 						<StateIndexNode
 							key={key}
 							node={node}
-							isOpenState={findViewIsOpenState(node.key)}
-							typeState={findStateTypeState(node)}
+							isOpenState={findState(findViewIsOpenState, node.key)}
+							typeState={findState(findStateTypeState, node)}
 						/>
 					)
 				})}

package/react-devtools/src/TimelineIndex.tsx

@@ -26,9 +26,13 @@ export const TimelineLog: FC<{
 	const setIsOpen = useI(isOpenState)
 
 	return (
-		<section className="node timeline_log">
+		<section className="node timeline_log" data-testid={`timeline-${token.key}`}>
 			<header>
-				<button.OpenClose isOpen={isOpen} setIsOpen={setIsOpen} />
+				<button.OpenClose
+					isOpen={isOpen}
+					testid={`open-close-timeline-${token.key}`}
+					setIsOpen={setIsOpen}
+				/>
 				<label>
 					<h2>{token.key}</h2>
 					<span className="detail length">
@@ -58,7 +62,10 @@ export const TimelineLog: FC<{
 					{timeline.history.map((update, index) => (
 						<Fragment key={update.key + index + timeline.at}>
 							{index === timeline.at ? <YouAreHere /> : null}
-							<article.TimelineUpdate timelineUpdate={update} />
+							<article.TimelineUpdate
+								timelineUpdate={update}
+								serialNumber={index}
+							/>
 							{index === timeline.history.length - 1 &&
 							timeline.at === timeline.history.length ? (
 								<YouAreHere />
@@ -74,7 +81,7 @@ export const TimelineLog: FC<{
 export const TimelineIndex: FC = () => {
 	const tokenIds = useO(timelineIndex)
 	return (
-		<article className="index timeline_index">
+		<article className="index timeline_index" data-testid="timeline-index">
 			{tokenIds
 				.filter((token) => !token.key.startsWith(`👁‍🗨`))
 				.map((token) => {

package/react-devtools/src/TransactionIndex.tsx

@@ -27,9 +27,16 @@ export const TransactionLog: FC<{
 	const setIsOpen = useI(isOpenState)
 
 	return (
-		<section className="node transaction_log">
+		<section
+			className="node transaction_log"
+			data-testid={`transaction-${token.key}`}
+		>
 			<header>
-				<button.OpenClose isOpen={isOpen} setIsOpen={setIsOpen} />
+				<button.OpenClose
+					isOpen={isOpen}
+					testid={`open-close-transaction-${token.key}`}
+					setIsOpen={setIsOpen}
+				/>
 				<label>
 					<h2>{token.key}</h2>
 					<span className="detail length">({log.length})</span>
@@ -53,7 +60,7 @@ export const TransactionLog: FC<{
 export const TransactionIndex: FC = () => {
 	const tokenIds = useO(transactionIndex)
 	return (
-		<article className="index transaction_index">
+		<article className="index transaction_index" data-testid="transaction-index">
 			{tokenIds
 				.filter((token) => !token.key.startsWith(`👁‍🗨`))
 				.map((token) => {

package/react-devtools/src/Updates.tsx

@@ -36,7 +36,10 @@ const TransactionUpdateFC: React.FC<{
 	transactionUpdate: TransactionUpdate<ƒn>
 }> = ({ serialNumber, transactionUpdate }) => {
 	return (
-		<article className="node transaction_update">
+		<article
+			className="node transaction_update"
+			data-testid={`transaction-update-${transactionUpdate.key}-${serialNumber}`}
+		>
 			<header>
 				<h4>{serialNumber}</h4>
 			</header>
@@ -104,9 +107,13 @@ const TransactionUpdateFC: React.FC<{
 
 export const TimelineUpdateFC: React.FC<{
 	timelineUpdate: TimelineUpdate<any>
-}> = ({ timelineUpdate }) => {
+	serialNumber: number
+}> = ({ timelineUpdate, serialNumber }) => {
 	return (
-		<article className="node timeline_update">
+		<article
+			className="node timeline_update"
+			data-testid={`timeline-update-${timelineUpdate.key}-${serialNumber}`}
+		>
 			<header>
 				<h4>
 					{timelineUpdate.timestamp}: {timelineUpdate.type} ({timelineUpdate.key}

package/realtime-react/dist/index.cjs

@@ -47,7 +47,7 @@ var RealtimeProvider = ({ children, socket }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(RealtimeContext.Provider, { value: { socket, services }, children });
 };
 var { NODE_ENV } = process.env;
-var IN_DEV = NODE_ENV === `development` || NODE_ENV === `test`;
+var IN_DEV = NODE_ENV === `development`;
 function noop() {
 }
 function useSingleEffect(effect, deps) {

package/realtime-react/dist/index.js

@@ -25,7 +25,7 @@ var RealtimeProvider = ({ children, socket }) => {
   return /* @__PURE__ */ jsx(RealtimeContext.Provider, { value: { socket, services }, children });
 };
 var { NODE_ENV } = process.env;
-var IN_DEV = NODE_ENV === `development` || NODE_ENV === `test`;
+var IN_DEV = NODE_ENV === `development`;
 function noop() {
 }
 function useSingleEffect(effect, deps) {

package/realtime-react/src/use-single-effect.ts

@@ -1,7 +1,7 @@
 import * as React from "react"
 
 const { NODE_ENV } = process.env
-const IN_DEV = NODE_ENV === `development` || NODE_ENV === `test`
+const IN_DEV = NODE_ENV === `development`
 
 function noop() {}
 

package/realtime-server/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { Subject, Transceiver, Store } from 'atom.io/internal';
 import { Json, Stringified, JsonIO } from 'atom.io/json';
-import { ChildProcessWithoutNullStreams } from 'child_process';
+import { ChildProcessWithoutNullStreams } from 'node:child_process';
 import { ContinuityToken, UserInRoomMeta } from 'atom.io/realtime';
 import * as AtomIO from 'atom.io';
 import { TransactionUpdateContent, TransactionUpdate, WritableToken } from 'atom.io';

package/realtime-server/src/ipc-sockets/child-socket.ts

@@ -1,4 +1,4 @@
-import type { ChildProcessWithoutNullStreams } from "child_process"
+import type { ChildProcessWithoutNullStreams } from "node:child_process"
 
 import type { Json } from "atom.io/json"
 import { parseJson } from "atom.io/json"

package/realtime-server/src/realtime-server-stores/server-room-external-store.ts

@@ -1,5 +1,5 @@
-import type { ChildProcessWithoutNullStreams } from "child_process"
-import { spawn } from "child_process"
+import type { ChildProcessWithoutNullStreams } from "node:child_process"
+import { spawn } from "node:child_process"
 
 import { atomFamily, selectorFamily } from "atom.io"
 import type { Loadable } from "atom.io/data"

package/realtime-testing/dist/index.js

@@ -1,7 +1,7 @@
 import { myUsernameState } from '../../dist/chunk-O47EQUM6.js';
 import { editRelationsInStore } from '../../dist/chunk-7ZR244C2.js';
 import '../../dist/chunk-WX2NCOZR.js';
-import { recordToEntries } from '../../dist/chunk-CVBEVTM5.js';
+import { recordToEntries } from '../../dist/chunk-7VCCW45K.js';
 import '../../dist/chunk-BWWVY5O5.js';
 import { __spreadProps, __spreadValues } from '../../dist/chunk-U2IICNHQ.js';
 import * as http from 'http';

package/realtime-testing/src/setup-realtime-test.tsx

@@ -1,4 +1,4 @@
-import * as http from "http"
+import * as http from "node:http"
 
 import { prettyDOM, render } from "@testing-library/react"
 import type { RenderResult } from "@testing-library/react"

package/src/silo.ts

@@ -7,6 +7,7 @@ import {
 	createStandaloneSelector,
 	createTimeline,
 	createTransaction,
+	findInStore,
 	getFromStore,
 	setIntoStore,
 	timeTravel,
@@ -23,6 +24,7 @@ import type {
 	RegularAtomFamilyOptions,
 	RegularAtomOptions,
 	RegularAtomToken,
+	findState,
 	getState,
 	redo,
 	setState,
@@ -42,6 +44,7 @@ export class Silo {
 	public selectorFamily: typeof selectorFamily
 	public transaction: typeof transaction
 	public timeline: typeof timeline
+	public findState: typeof findState
 	public getState: typeof getState
 	public setState: typeof setState
 	public subscribe: typeof subscribe
@@ -80,6 +83,7 @@ export class Silo {
 		this.selectorFamily = (options) => createSelectorFamily(options, s) as any
 		this.transaction = (options) => createTransaction(options, s)
 		this.timeline = (options) => createTimeline(options, s)
+		this.findState = (token, key) => findInStore(token, key, s) as any
 		this.getState = (token) => getFromStore(token, s)
 		this.setState = (token, newValue) => setIntoStore(token, newValue, s)
 		this.subscribe = (token, handler, key) => subscribe(token, handler, key, s)

package/src/validators.ts

@@ -24,8 +24,8 @@ export type TokenType<
 > = Comparison extends ReadableToken<infer RepresentedValue>
 	? RepresentedValue
 	: Comparison extends ReadableFamilyToken<infer RepresentedValue, any>
-	  ? RepresentedValue
-	  : never
+		? RepresentedValue
+		: never
 
 export function isToken<KnownToken extends RegularAtomToken<any>>(
 	knownToken: KnownToken,