Convert updeep to immer (fixes #704)

.vscode/settings.json

@@ -36,6 +36,7 @@
     "gmail",
     "hardcoded",
     "IIDX",
+    "immer",
     "interop",
     "IPFS",
     "JKOC",
@@ -78,7 +79,6 @@
     "timesynchro",
     "tocstop",
     "transpiler",
-    "updeep",
     "workspaces"
   ],
   "eslint.enable": true,

bemuse/package.json

@@ -163,12 +163,12 @@
     "serviceworker-webpack-plugin": "^1.0.1",
     "throat": "^2.0.2",
     "timesynchro": "^1.0.1",
-    "updeep": "^0.16.0",
     "variance": "0.0.1",
     "whatwg-fetch": "^1.1.1",
     "downshift": "~6.1.7",
     "@radix-ui/react-alert-dialog": "~0.1.5",
-    "fuzzysort": "~1.1.4"
+    "fuzzysort": "~1.1.4",
+    "immer": "~9.0.15"
   },
   "resolutions": {
     "natives": "1.1.6"

bemuse/src/app/entities/LoadState.js

@@ -1,5 +1,5 @@
 // An entity that represents something that can have a loading state.
-import u from 'updeep'
+import produce from 'immer'
 
 // Initializers
 export const initLoading = () => ({ status: 'loading' })
@@ -19,13 +19,13 @@ export const error = (state) => isError(state) && state.error
 export const beginLoading = (state) => initLoading()
 
 export const completeWithValue = (value) =>
-  u({
-    status: 'completed',
-    value: () => value,
+  produce(draft => {
+    draft.status = 'completed'
+    draft.value = value
   })
 
 export const errorWithReason = (error) =>
-  u({
-    status: 'error',
-    error: () => error,
+  produce(draft => {
+    draft.status = 'error'
+    draft.error = error
   })

bemuse/src/app/entities/MusicSearchText.js

@@ -1,4 +1,4 @@
-import u from 'updeep'
+import produce from 'immer'
 
 // Initializers
 export const initWithText = (text) => ({
@@ -14,6 +14,6 @@ export const searchText = (state) => state.committed
 export const inputText = (state) => state.staged
 
 // Updaters
-export const handleTextType = (text) => u({ staged: text })
+export const handleTextType = (text) => produce(draft => { draft.staged = text })
 export const handleDebounce = (state) => ({ ...state, committed: state.staged })
 export const setText = (text) => () => initWithText(text)

bemuse/src/app/entities/MusicSelection.js

@@ -1,4 +1,4 @@
-import u from 'updeep'
+import produce from 'immer'
 import _ from 'lodash'
 
 export const initialState = {
@@ -24,14 +24,14 @@ export const selectedChartGivenCharts = (charts) => (state) => {
 
 // Updater
 export const selectSong = (songId) =>
-  u({
-    selectedSongId: songId,
+  produce(draft => {
+    draft.selectedSongId = songId
   })
 export const selectChart = (songId, chartId, chartLevel) =>
-  u({
-    selectedSongId: songId,
-    selectedChartId: chartId,
-    selectedChartLevel: chartLevel,
+  produce(draft => {
+    draft.selectedSongId = songId
+    draft.selectedChartId = chartId
+    draft.selectedChartLevel = chartLevel
   })
 
 // Utilities

bemuse/src/app/entities/Options.js

@@ -1,5 +1,5 @@
 import _ from 'lodash'
-import u from 'updeep'
+import produce from 'immer'
 
 import * as options from '../options'
 
@@ -18,22 +18,21 @@ const toggleOption = (value) => (toggleOptionEnabled(value) ? '0' : '1')
 export const getKeyMapping = (mode, key) => (state) =>
   state['input.P1.keyboard.' + mode + '.' + key]
 export const changeKeyMapping = (mode, key, keyCode) =>
-  u({
-    ['input.P1.keyboard.' + mode + '.' + key]: keyCode,
+  produce(draft => {
+    draft['input.P1.keyboard.' + mode + '.' + key] = keyCode
   })
 
 // Play mode
 export const playMode = (state) => state['player.P1.mode']
 export const changePlayMode = (mode) =>
-  u({
-    'player.P1.mode': mode,
-    'player.P1.panel': (panel) =>
-      panel === '3d' && mode !== 'KB' ? 'center' : panel,
+  produce(draft => {
+    draft['player.P1.mode'] = mode
+    draft['player.P1.panel'] = draft['player.P1.panel'] === '3d' && mode !== 'KB' ? 'center' : draft['player.P1.panel']
   })
 
 // Speed
 export const speed = (state) => state['player.P1.speed']
-export const changeSpeed = (speed) => u({ 'player.P1.speed': speed })
+export const changeSpeed = (speed) => produce(draft => { draft['player.P1.speed'] = speed })
 
 // Lead time
 export const leadTime = (state) => {
@@ -43,7 +42,7 @@ export const leadTime = (state) => {
   return parsed
 }
 export const changeLeadTime = (leadTime) =>
-  u({ 'player.P1.lead-time': leadTime })
+  produce(draft => { draft['player.P1.lead-time'] = leadTime })
 
 // Scratch position
 export const scratchPosition = (state) => {
@@ -57,17 +56,16 @@ export const changeScratchPosition = (position) => {
   if (position === 'off') {
     return changePlayMode('KB')
   } else {
-    return _.flow(changePlayMode('BM'), u({ 'player.P1.scratch': position }))
+    return _.flow(changePlayMode('BM'), produce(draft => { draft['player.P1.scratch'] = position }))
   }
 }
 
 // Panel
 export const panelPlacement = (state) => state['player.P1.panel']
 export const changePanelPlacement = (placement) =>
-  u({
-    'player.P1.panel': placement,
-    'player.P1.mode': (mode) =>
-      placement === '3d' && mode !== 'KB' ? 'KB' : mode,
+  produce(draft => {
+    draft['player.P1.panel'] = placement
+    draft['player.P1.mode'] = placement === '3d' && draft['player.P1.mode'] !== 'KB' ? 'KB' : draft['player.P1.mode']
   })
 
 // Lane cover
@@ -80,34 +78,34 @@ export const laneCover = (state) => {
   )
 }
 export const changeLaneCover = (laneCover) =>
-  u({ 'player.P1.lane-cover': laneCover })
+  produce(draft => { draft['player.P1.lane-cover'] = laneCover })
 
 // BGA
 export const isBackgroundAnimationsEnabled = (state) =>
   toggleOptionEnabled(state['system.bga.enabled'])
-export const toggleBackgroundAnimations = u({
-  'system.bga.enabled': toggleOption,
+export const toggleBackgroundAnimations = produce(draft => {
+  draft['system.bga.enabled'] = toggleOption(draft['system.bga.enabled'])
 })
 
 // Auto-velocity
 export const isAutoVelocityEnabled = (state) =>
   toggleOptionEnabled(state['player.P1.auto-velocity'])
-export const toggleAutoVelocity = u({
-  'player.P1.auto-velocity': toggleOption,
+export const toggleAutoVelocity = produce(draft => {
+  draft['player.P1.auto-velocity'] = toggleOption(draft['player.P1.auto-velocity'])
 })
 
 // Song preview enabled
 export const isPreviewEnabled = (state) =>
   toggleOptionEnabled(state['system.preview.enabled'])
-export const togglePreview = u({
-  'system.preview.enabled': toggleOption,
+export const togglePreview = produce(draft => {
+  draft['system.preview.enabled'] = toggleOption(draft['system.preview.enabled'])
 })
 
 // Gauge
 export const isGaugeEnabled = (state) => getGauge(state) !== 'off'
 export const getGauge = (state) => state['player.P1.gauge']
-export const toggleGauge = u({
-  'player.P1.gauge': (gauge) => (gauge === 'off' ? 'hope' : 'off'),
+export const toggleGauge = produce(draft => {
+  draft['player.P1.gauge'] = draft['player.P1.gauge'] === 'off' ? 'hope' : 'off'
 })
 
 // Queries
@@ -124,34 +122,34 @@ export const keyboardMapping = (state) => {
 export const hasAcknowledged = (featureKey) => (state) =>
   state[`system.ack.${featureKey}`] === '1'
 export const acknowledge = (featureKey) =>
-  u({
-    [`system.ack.${featureKey}`]: '1',
+produce(draft => {
+    draft[`system.ack.${featureKey}`] = '1'
   })
 
 // Audio-input latency
 export const audioInputLatency = (state) => +state['system.offset.audio-input']
 export const changeAudioInputLatency = (latency) =>
-  u({
-    'system.offset.audio-input': `${latency}`,
+produce(draft => {
+    draft['system.offset.audio-input'] = `${latency}`
   })
 
 // Gamepad Continuous Axis
 export const isContinuousAxisEnabled = (state) =>
   toggleOptionEnabled(state['gamepad.continuous'])
-export const toggleContinuousAxis = u({
-  'gamepad.continuous': toggleOption,
+export const toggleContinuousAxis = produce(draft => {
+  draft['gamepad.continuous'] = toggleOption(draft['gamepad.continuous'])
 })
 
 // Gamepad Sensitivity
 export const sensitivity = (state) => state['gamepad.sensitivity']
 export const changeSensitivity = (sensitivity) =>
-  u({ 'gamepad.sensitivity': sensitivity })
+  produce(draft => { draft['gamepad.sensitivity'] = sensitivity })
 
 // Latest version
 export const lastSeenVersion = (state) => state['system.last-seen-version']
 export const updateLastSeenVersion = (newVersion) =>
-  u({
-    'system.last-seen-version': newVersion,
+  produce(draft => {
+    draft['system.last-seen-version'] = newVersion
   })
 
 // Utils

bemuse/src/music-collection/preprocessCollection.js

@@ -1,27 +1,31 @@
-import u from 'updeep'
+import produce from 'immer'
 
-export const preprocessCollection = u({
-  songs: u.map(preprocessSong),
+export const preprocessCollection = produce((draft, songs) => {
+  if (songs) {
+    draft.songs = songs.map(song => preprocessSong(song))
+  }
 })
 
 function preprocessSong(song) {
   if (song.chart_names) {
-    song = u(
-      {
-        charts: u.map((chart) => {
-          const name = song.chart_names[chart.file]
-          if (!name) return chart
-          return u(
-            {
-              info: {
-                subtitles: (subtitles) => [...subtitles, name],
-              },
-            },
-            chart
-          )
-        }),
-      },
-      song
+    song = produce(
+      song,
+      draft => {
+        if (draft.charts) {
+          draft.charts = draft.charts.map((chart) => {
+            const name = song.chart_names[chart.file]
+            if (!name) return chart
+            return produce(
+              chart,
+              draft => {
+                draft.info = {
+                  subtitles: (subtitles) => [...subtitles, name],
+                }
+              }
+            )
+          })
+        }
+      }
     )
   }
   return song