atom.io 0.3.1 → 0.4.0

package/src/react-explorer/explorer-states.ts

@@ -0,0 +1,224 @@
+import { lastOf } from "~/packages/anvl/src/array"
+import { now } from "~/packages/anvl/src/id"
+import { Join } from "~/packages/anvl/src/join"
+import type { Entries } from "~/packages/anvl/src/object"
+import { cannotExist } from "~/packages/anvl/src/refinement"
+
+import { addToIndex, removeFromIndex } from "."
+import {
+  makeSpaceLayoutNodeFamily,
+  makeSpaceFamily,
+  makeSpaceIndex,
+  makeSpaceLayoutState,
+} from "./space-states"
+import type { View } from "./view-states"
+import {
+  makeViewFocusedFamily,
+  makeViewFamily,
+  makeViewIndex,
+} from "./view-states"
+import type {
+  AtomFamily,
+  AtomToken,
+  ReadonlySelectorFamily,
+  ReadonlySelectorToken,
+  SelectorFamily,
+  TransactionToken,
+  Write,
+} from ".."
+import { selectorFamily, selector, transaction, atom } from ".."
+import { persistAtom } from "../web-effects"
+
+export const makeViewsPerSpaceState = (
+  key: string
+): AtomToken<Join<null, `viewId`, `spaceId`>> =>
+  atom<Join<null, `viewId`, `spaceId`>>({
+    key: `${key}:views_per_space`,
+    default: new Join({ relationType: `1:n` }),
+    effects: [
+      persistAtom<Join<null, `viewId`, `spaceId`>>(localStorage)({
+        stringify: (index) => JSON.stringify(index.toJSON()),
+        parse: (json) =>
+          Join.fromJSON(JSON.parse(json), cannotExist, `viewId`, `spaceId`),
+      })(`${key}:views_per_space`),
+    ],
+  })
+
+export const makeSpaceViewsFamily = (
+  key: string,
+  viewsPerSpaceState: AtomToken<Join>
+): ReadonlySelectorFamily<string[], string> =>
+  selectorFamily<string[], string>({
+    key: `${key}:space_views`,
+    get:
+      (spaceId) =>
+      ({ get }) => {
+        const join = get(viewsPerSpaceState)
+        const viewIds = join.getRelatedIds(spaceId)
+        return viewIds
+      },
+  })
+
+export const makeSpaceFocusedViewFamily = (
+  key: string,
+  findSpaceViewsState: ReadonlySelectorFamily<string[], string>,
+  findViewFocusedState: AtomFamily<number, string>
+): SelectorFamily<string | null, string> =>
+  selectorFamily<string | null, string>({
+    key: `${key}:space_focused_view`,
+    get:
+      (spaceKey) =>
+      ({ get }) => {
+        const views = get(findSpaceViewsState(spaceKey))
+        const viewsLastFocused = views.map((viewKey): [string, number] => [
+          viewKey,
+          get(findViewFocusedState(viewKey)),
+        ])
+        const lastFocused = lastOf(viewsLastFocused.sort((a, b) => b[1] - a[1]))
+        return lastFocused ? lastFocused[0] : null
+      },
+    set:
+      (spaceKey) =>
+      ({ get, set }, viewKey) => {
+        if (viewKey === null) {
+          return
+        }
+        const views = get(findSpaceViewsState(spaceKey))
+        if (views.includes(viewKey)) {
+          set(findViewFocusedState(viewKey), Date.now())
+        } else {
+          console.warn(`View ${viewKey} not found in space ${spaceKey}`)
+        }
+      },
+  })
+
+type AddViewOptions = { spaceId?: string; path?: string }
+type SplitSpaceOptions = { parentId?: string }
+
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+export const attachExplorerState = (key: string) => {
+  const findSpaceState = makeSpaceFamily(key)
+  const findViewState = makeViewFamily(key)
+  const findViewFocusedState = makeViewFocusedFamily(key)
+  const spaceIndexState = makeSpaceIndex(key)
+  const spaceLayoutState = makeSpaceLayoutState(key)
+  const viewIndexState = makeViewIndex(key)
+  const viewsPerSpaceState = makeViewsPerSpaceState(key)
+
+  const findSpaceLayoutNode = makeSpaceLayoutNodeFamily(key, spaceLayoutState)
+  const findSpaceViewsState = makeSpaceViewsFamily(key, viewsPerSpaceState)
+  const findSpaceFocusedViewState = makeSpaceFocusedViewFamily(
+    key,
+    findSpaceViewsState,
+    findViewFocusedState
+  )
+
+  const allViewsState = selector<Entries<string, View>>({
+    key: `${key}:all_views`,
+    get: ({ get }) => {
+      const viewIndex = get(viewIndexState)
+      return [...viewIndex].map((id) => [id, get(findViewState(id))])
+    },
+  })
+
+  const writeOperationAddSpace: Write<
+    (options?: SplitSpaceOptions) => string
+  > = (transactors, { parentId = `root` } = {}) => {
+    const { set } = transactors
+    const key = `s-${now()}`
+    addToIndex(transactors, { indexAtom: spaceIndexState, id: key })
+    set(spaceLayoutState, (current) =>
+      current.set({ parent: `parent:${parentId}`, child: key }, { size: 1 })
+    )
+    set(findSpaceState(key), 1)
+    return key
+  }
+
+  const writeOperationRemoveSpace: Write<(id: string) => void> = (
+    transactors,
+    id
+  ) => {
+    removeFromIndex(transactors, { indexAtom: spaceIndexState, id })
+    transactors.set(findSpaceState(id), null)
+  }
+
+  const writeOperationAddView: Write<(options?: AddViewOptions) => void> = (
+    transactors,
+    { spaceId: maybeSpaceId, path } = {}
+  ) => {
+    const { get, set } = transactors
+    const id = `v-${now()}`
+
+    addToIndex(transactors, { indexAtom: viewIndexState, id })
+    set(
+      findViewState(id),
+      (current): View => ({
+        ...current,
+        location: {
+          ...current.location,
+          pathname: path ?? `/`,
+        },
+      })
+    )
+    const spaceId =
+      maybeSpaceId ??
+      lastOf([...get(spaceIndexState)]) ??
+      writeOperationAddSpace(transactors)
+    set(findViewFocusedState(id), Date.now())
+
+    set(viewsPerSpaceState, (current) => current.set({ spaceId, viewId: id }))
+    set(findViewFocusedState(id), Date.now())
+  }
+
+  const writeOperationRemoveView: Write<(viewId: string) => void> = (
+    transactors,
+    viewId
+  ) => {
+    const { set } = transactors
+    removeFromIndex(transactors, { indexAtom: viewIndexState, id: viewId })
+    set(viewsPerSpaceState, (current) => current.remove({ viewId }))
+    set(findViewState(viewId), null)
+  }
+
+  const addView = transaction<(options?: AddViewOptions) => void>({
+    key: `${key}:add_view`,
+    do: writeOperationAddView,
+  })
+
+  const removeView = transaction({
+    key: `${key}:remove_view`,
+    do: writeOperationRemoveView,
+  })
+
+  const addSpace = transaction({
+    key: `${key}:add_space`,
+    do: writeOperationAddSpace,
+  })
+
+  const removeSpace = transaction({
+    key: `${key}:remove_space`,
+    do: writeOperationRemoveSpace,
+  })
+
+  return {
+    addSpace,
+    addView,
+    allViewsState,
+    findSpaceLayoutNode,
+    findSpaceFocusedViewState,
+    findSpaceState,
+    findSpaceViewsState,
+    findViewState,
+    findViewFocusedState,
+    removeSpace,
+    removeView,
+    spaceIndexState,
+    spaceLayoutState,
+    viewIndexState,
+    viewsPerSpaceState,
+    writeOperationAddSpace,
+    writeOperationAddView,
+    writeOperationRemoveSpace,
+    writeOperationRemoveView,
+  }
+}

package/src/react-explorer/index.ts

@@ -0,0 +1,23 @@
+import type { AtomToken, Write } from ".."
+
+export * from "./AtomIOExplorer"
+
+export type AtomicIndexOptions = {
+  indexAtom: AtomToken<Set<string>>
+  id: string
+}
+
+export const addToIndex: Write<(options: AtomicIndexOptions) => void> = (
+  { set },
+  { indexAtom, id }
+): void => set(indexAtom, (currentSet) => new Set(currentSet).add(id))
+
+export const removeFromIndex: Write<(options: AtomicIndexOptions) => void> = (
+  { set },
+  { indexAtom, id }
+): void =>
+  set(indexAtom, (currentSet) => {
+    const newSet = new Set(currentSet)
+    newSet.delete(id)
+    return newSet
+  })

package/src/react-explorer/space-states.ts

@@ -0,0 +1,73 @@
+import { isNumber } from "fp-ts/lib/number"
+
+import { Join } from "~/packages/anvl/src/join"
+import { parseJson, stringifyJson } from "~/packages/anvl/src/json"
+import { hasExactProperties } from "~/packages/anvl/src/object"
+
+import { persistStringSetAtom } from "./explorer-effects"
+import type { AtomToken, ReadonlySelectorFamily, SelectorFamily } from ".."
+import { selectorFamily } from ".."
+import type { AtomFamily } from "../atom"
+import { atom, atomFamily } from "../atom"
+import { lazyLocalStorageEffect, persistAtom } from "../web-effects"
+
+export const makeSpaceIndex = (key: string): AtomToken<Set<string>> =>
+  atom<Set<string>>({
+    key: `${key}:space_index`,
+    default: new Set([`root`]),
+    effects: [persistStringSetAtom(`${key}:space_index`)],
+  })
+
+export const makeSpaceLayoutState = (
+  key: string
+): AtomToken<Join<{ size: number }, `parent`, `child`>> =>
+  atom({
+    key: `${key}:space_layout`,
+    default: new Join({ relationType: `1:n` }),
+    effects: [
+      persistAtom<Join<{ size: number }, `parent`, `child`>>(localStorage)({
+        stringify: (join) => stringifyJson(join.toJSON()),
+        parse: (string) => {
+          try {
+            const json = parseJson(string)
+            const join = Join.fromJSON(
+              json,
+              hasExactProperties({ size: isNumber }),
+              `parent`,
+              `child`
+            )
+            return join
+          } catch (thrown) {
+            console.error(`Error parsing spaceLayoutState from localStorage`)
+            return new Join({ relationType: `1:n` })
+          }
+        },
+      })(`${key}:space_layout`),
+    ],
+  })
+
+export const makeSpaceLayoutNodeFamily = (
+  key: string,
+  spaceLayoutState: AtomToken<Join<{ size: number }>>
+): ReadonlySelectorFamily<{ childSpaceIds: string[]; size: number }, string> =>
+  selectorFamily<{ childSpaceIds: string[]; size: number }, string>({
+    key: `${key}:explorer_space`,
+    get:
+      (me) =>
+      ({ get }) => {
+        const join = get(spaceLayoutState)
+        const myFollowers = join.getRelatedIds(`parent:${me}`)
+        const myLeader = join.getRelatedId(me)
+        const { size } = myLeader
+          ? join.getContent(myLeader, me) ?? { size: NaN }
+          : { size: NaN }
+        return { childSpaceIds: myFollowers, size }
+      },
+  })
+
+export const makeSpaceFamily = (key: string): AtomFamily<number, string> =>
+  atomFamily<number, string>({
+    key: `${key}:space`,
+    default: 1,
+    effects: (subKey) => [lazyLocalStorageEffect(`${key}:${subKey}`)],
+  })

package/src/react-explorer/view-states.ts

@@ -0,0 +1,43 @@
+import type { Location } from "react-router-dom"
+
+import { key } from "~/packages/anvl/src/object"
+
+import { persistStringSetAtom } from "./explorer-effects"
+import type { AtomToken } from ".."
+import type { AtomFamily } from "../atom"
+import { atom, atomFamily } from "../atom"
+import { lazyLocalStorageEffect } from "../web-effects"
+
+export type View = {
+  title: string
+  location: Omit<Location, `state`>
+}
+
+export const makeViewFamily = (key: string): AtomFamily<View, string> =>
+  atomFamily<View, string>({
+    key: `${key}:view`,
+    default: {
+      title: ``,
+      location: {
+        pathname: ``,
+        search: ``,
+        hash: ``,
+        key: ``,
+      },
+    },
+    effects: (subKey) => [lazyLocalStorageEffect(`${key}:${subKey}`)],
+  })
+
+export const makeViewIndex = (key: string): AtomToken<Set<string>> =>
+  atom<Set<string>>({
+    key: `${key}:view_index`,
+    default: new Set(),
+    effects: [persistStringSetAtom(`${key}:view_index`)],
+  })
+
+export const makeViewFocusedFamily = (key: string): AtomFamily<number, string> =>
+  atomFamily<number, string>({
+    key: `${key}:view_focused`,
+    default: 0,
+    effects: (subKey) => [lazyLocalStorageEffect(`${key}:${subKey}`)],
+  })

package/src/selector.ts

@@ -2,7 +2,7 @@ import type * as Rx from "rxjs"
 
 import type { Serializable } from "~/packages/anvl/src/json"
 
-import type { ReadonlyValueToken, SelectorToken } from "."
+import type { ReadonlySelectorToken, SelectorToken } from "."
 import { selectorFamily__INTERNAL, selector__INTERNAL } from "./internal"
 import type { Read, Write } from "./transaction"
 
@@ -13,13 +13,13 @@ export type SelectorOptions<T> = {
 }
 export type ReadonlySelectorOptions<T> = Omit<SelectorOptions<T>, `set`>
 
-export function selector<T>(options: SelectorOptions<T>): SelectorToken<T>
 export function selector<T>(
   options: ReadonlySelectorOptions<T>
-): ReadonlyValueToken<T>
+): ReadonlySelectorToken<T>
+export function selector<T>(options: SelectorOptions<T>): SelectorToken<T>
 export function selector<T>(
   options: ReadonlySelectorOptions<T> | SelectorOptions<T>
-): ReadonlyValueToken<T> | SelectorToken<T> {
+): ReadonlySelectorToken<T> | SelectorToken<T> {
   return selector__INTERNAL(options)
 }
 
@@ -43,10 +43,10 @@ export type SelectorFamily<T, K extends Serializable = Serializable> = ((
 
 export type ReadonlySelectorFamily<T, K extends Serializable = Serializable> = ((
   key: K
-) => ReadonlyValueToken<T>) & {
+) => ReadonlySelectorToken<T>) & {
   key: string
   type: `readonly_selector_family`
-  subject: Rx.Subject<ReadonlyValueToken<T>>
+  subject: Rx.Subject<ReadonlySelectorToken<T>>
 }
 
 export function selectorFamily<T, K extends Serializable>(

package/src/subscribe.ts

@@ -1,4 +1,4 @@
-import type { ReadonlyValueToken, StateToken, TransactionToken, ƒn } from "."
+import type { ReadonlySelectorToken, StateToken, TransactionToken, ƒn } from "."
 import type { Store, TransactionUpdate } from "./internal"
 import { IMPLICIT, subscribeToRootAtoms, withdraw } from "./internal"
 
@@ -6,7 +6,7 @@ export type StateUpdate<T> = { newValue: T; oldValue: T }
 export type UpdateHandler<T> = (update: StateUpdate<T>) => void
 
 export const subscribe = <T>(
-  token: ReadonlyValueToken<T> | StateToken<T>,
+  token: ReadonlySelectorToken<T> | StateToken<T>,
   handleUpdate: UpdateHandler<T>,
   store: Store = IMPLICIT.STORE
 ): (() => void) => {

package/src/timeline.ts

@@ -1,10 +1,6 @@
 import type { AtomFamily, AtomToken } from "."
 import { IMPLICIT } from "./internal"
-import {
-  redo__INTERNAL,
-  timeline__INTERNAL,
-  undo__INTERNAL,
-} from "./internal/timeline-internal"
+import { redo__INTERNAL, timeline__INTERNAL, undo__INTERNAL } from "./internal/"
 
 export type TimelineToken = {
   key: string

package/src/transaction.ts

@@ -1,13 +1,13 @@
 import type * as Rx from "rxjs"
 
-import type { ReadonlyValueToken, StateToken, TransactionToken } from "."
+import type { ReadonlySelectorToken, StateToken, TransactionToken } from "."
 import type { Store, TransactionUpdate } from "./internal"
 import { IMPLICIT, transaction__INTERNAL, withdraw } from "./internal"
 
 export type ƒn = (...parameters: any[]) => any
 
 export type Transactors = {
-  get: <S>(state: ReadonlyValueToken<S> | StateToken<S>) => S
+  get: <S>(state: ReadonlySelectorToken<S> | StateToken<S>) => S
   set: <S>(state: StateToken<S>, newValue: S | ((oldValue: S) => S)) => void
 }
 export type ReadonlyTransactors = Pick<Transactors, `get`>

package/src/web-effects/index.ts

@@ -0,0 +1 @@
+export * from "./storage"

package/src/web-effects/storage.ts

@@ -0,0 +1,30 @@
+import type { Json } from "~/packages/anvl/src/json"
+
+import type { AtomEffect } from "../index"
+
+export type StringInterface<T> = {
+  stringify: (t: T) => string
+  parse: (s: string) => T
+}
+
+export const persistAtom =
+  <T>(storage: Storage) =>
+  ({ stringify, parse }: StringInterface<T>) =>
+  (key: string): AtomEffect<T> =>
+  ({ setSelf, onSet }) => {
+    const savedValue = storage.getItem(key)
+
+    if (savedValue != null) setSelf(parse(savedValue))
+
+    onSet(({ newValue }) => {
+      if (newValue == null) {
+        storage.removeItem(key)
+        return
+      }
+      storage.setItem(key, stringify(newValue))
+    })
+  }
+
+export const lazyLocalStorageEffect: <J extends Json>(
+  key: string
+) => AtomEffect<J> = persistAtom(localStorage)(JSON)