Consistently use selectors for code/position/selection

This will reduce the amount of change in future commits where we move
these values around.

Author: shepmaster

ui/frontend/actions.ts

@@ -4,6 +4,7 @@ import url, { UrlObject } from 'url';
 import { z } from 'zod';
 
 import {
+  codeSelector,
   clippyRequestSelector,
   formatRequestSelector,
   getCrateType,
@@ -304,7 +305,8 @@ interface ExecuteRequestBody {
 
 const performCommonExecute = (crateType: string, tests: boolean): ThunkAction => (dispatch, getState) => {
   const state = getState();
-  const { code, configuration: { channel, mode, edition } } = state;
+  const code = codeSelector(state);
+  const { configuration: { channel, mode, edition } } = state;
   const backtrace = state.configuration.backtrace === Backtrace.Enabled;
 
   if (useWebsocketSelector(state)) {
@@ -365,7 +367,8 @@ function performCompileShow(
     dispatch(request());
 
     const state = getState();
-    const { code, configuration: {
+    const code = codeSelector(state);
+    const { configuration: {
       channel,
       mode,
       edition,
@@ -678,9 +681,11 @@ export function performMiri(): ThunkAction {
   return function(dispatch, getState) {
     dispatch(requestMiri());
 
-    const { code, configuration: {
+    const state = getState();
+    const code = codeSelector(state);
+    const { configuration: {
       edition,
-    } } = getState();
+    } } = state;
     const body: MiriRequestBody = { code, edition };
 
     return jsonPost<MiriResponseBody>(routes.miri, body)
@@ -716,9 +721,11 @@ export function performMacroExpansion(): ThunkAction {
   return function(dispatch, getState) {
     dispatch(requestMacroExpansion());
 
-    const { code, configuration: {
+    const state = getState();
+    const code = codeSelector(state);
+    const { configuration: {
       edition,
-    } } = getState();
+    } } = state;
     const body: MacroExpansionRequestBody = { code, edition };
 
     return jsonPost<MacroExpansionResponseBody>(routes.macroExpansion, body)
@@ -779,8 +786,9 @@ export function performGistSave(): ThunkAction {
   return function(dispatch, getState) {
     dispatch(requestGistSave());
 
+    const state = getState();
+    const code = codeSelector(state);
     const {
-      code,
       configuration: {
         channel, mode, edition,
       },
@@ -790,7 +798,7 @@ export function performGistSave(): ThunkAction {
           stderr = '',
         },
       },
-    } = getState();
+    } = state;
 
     return jsonPost<GistResponseBody>(routes.meta.gist, { code })
       .then(json => dispatch(receiveGistSaveSuccess({ ...json, code, stdout, stderr, channel, mode, edition })));

ui/frontend/editor/Editor.tsx

@@ -8,6 +8,7 @@ import AceEditor from './AceEditor';
 import SimpleEditor from './SimpleEditor';
 import MonacoEditor from './MonacoEditor';
 import { Editor as EditorType } from '../types';
+import { codeSelector, positionSelector, selectionSelector } from '../selectors';
 import { State } from '../reducers';
 
 import styles from './Editor.module.css';
@@ -19,10 +20,10 @@ const editorMap = {
 };
 
 const Editor: React.FC = () => {
-  const code = useSelector((state: State) => state.code);
+  const code = useSelector(codeSelector);
   const editor = useSelector((state: State) => state.configuration.editor);
-  const position = useSelector((state: State) => state.position);
-  const selection = useSelector((state: State) => state.selection);
+  const position = useSelector(positionSelector);
+  const selection = useSelector(selectionSelector);
   const crates = useSelector((state: State) => state.crates);
 
   const dispatch = useAppDispatch();

ui/frontend/local_storage.ts

@@ -5,6 +5,7 @@
 import State from './state';
 import {removeVersion, initializeStorage, PartialState} from './storage';
 import { AssemblyFlavor, DemangleAssembly, Editor, Orientation, PairCharacters, ProcessAssembly } from './types';
+import { codeSelector } from './selectors';
 
 const CURRENT_VERSION = 2;
 
@@ -48,6 +49,7 @@ interface V1Configuration {
 type CurrentConfiguration = V2Configuration;
 
 export function serialize(state: State): string {
+  const code = codeSelector(state);
   const conf: CurrentConfiguration = {
     version: CURRENT_VERSION,
     configuration: {
@@ -65,7 +67,7 @@ export function serialize(state: State): string {
       demangleAssembly: state.configuration.demangleAssembly,
       processAssembly: state.configuration.processAssembly,
     },
-    code: state.code,
+    code,
     notifications: state.notifications,
   };
   return JSON.stringify(conf);

ui/frontend/selectors/index.ts

@@ -14,7 +14,9 @@ import {
   Version,
 } from '../types';
 
-const codeSelector = (state: State) => state.code;
+export const codeSelector = (state: State) => state.code;
+export const positionSelector = (state: State) => state.position;
+export const selectionSelector = (state: State) => state.selection;
 
 const HAS_TESTS_RE = /^\s*#\s*\[\s*test\s*([^"]*)]/m;
 export const hasTestsSelector = createSelector(codeSelector, code => !!code.match(HAS_TESTS_RE));

ui/frontend/session_storage.ts

@@ -4,16 +4,19 @@
 
 import { State } from './reducers';
 import {removeVersion, initializeStorage, PartialState} from './storage';
+import { codeSelector } from './selectors';
 
 const CURRENT_VERSION = 1;
 
 export function serialize(state: State): string {
+  const code = codeSelector(state);
+
   return JSON.stringify({
     version: CURRENT_VERSION,
     configuration: {
       primaryAction: state.configuration.primaryAction,
     },
-    code: state.code,
+    code,
   });
 }