lib - Add node highlighting and consume in log-identifier

lib/src/store/index.tsx

@@ -4,12 +4,17 @@ import {
   applyMiddleware,
   Middleware
 } from "redux";
+import { useSelector, TypedUseSelectorHook } from "react-redux";
 import { composeWithDevTools } from "redux-devtools-extension";
 
-import { sourceFilesReducer } from "./sourceFiles/reducer";
+import {
+  sourceFilesReducer,
+  highlightedNodesReducer
+} from "./sourceFiles/reducer";
 
 const rootReducer = combineReducers({
-  sourceFiles: sourceFilesReducer
+  sourceFiles: sourceFilesReducer,
+  highlightedNodes: highlightedNodesReducer
 });
 
 export type AppState = ReturnType<typeof rootReducer>;
@@ -25,3 +30,5 @@ export default function configureStore() {
 
   return store;
 }
+
+export const useTypedSelector: TypedUseSelectorHook<AppState> = useSelector;

lib/src/store/sourceFiles/actions.ts

@@ -1,22 +1,50 @@
 import * as ts from "typescript";
-import { INIT_SOURCEFILE, UPDATE_SOURCEFILE, CLEAR_SOURCEFILE } from "./types";
+import {
+  INIT_SOURCEFILE,
+  UPDATE_SOURCEFILE,
+  CLEAR_SOURCEFILE,
+  HIGHLIGHT_NODE,
+  CLEAR_HIGHLIGHTED_NODES,
+  InitSourceFileAction,
+  UpdateSourceFileAction,
+  ClearSourceFileAction,
+  HighlightNodeAction,
+  ClearHighlightedNodesAction
+} from "./types";
 
-export function initSourceFile(sourceFile: ts.SourceFile) {
+export function initSourceFile(
+  sourceFile: ts.SourceFile
+): InitSourceFileAction {
   return {
     type: INIT_SOURCEFILE,
     payload: { sourceFile }
   };
 }
 
-export function updateSourceFile(sourceFile: ts.SourceFile) {
+export function updateSourceFile(
+  sourceFile: ts.SourceFile
+): UpdateSourceFileAction {
   return {
     type: UPDATE_SOURCEFILE,
     payload: { sourceFile }
   };
 }
 
-export function clearSourceFile() {
+export function clearSourceFile(): ClearSourceFileAction {
   return {
-    type: CLEAR_SOURCEFILE,
+    type: CLEAR_SOURCEFILE
+  };
+}
+
+export function highlightNode(node: ts.Node): HighlightNodeAction {
+  return {
+    type: HIGHLIGHT_NODE,
+    payload: { node }
+  };
+}
+
+export function clearHighlightedNodes(): ClearHighlightedNodesAction {
+  return {
+    type: CLEAR_HIGHLIGHTED_NODES
   };
 }

lib/src/store/sourceFiles/reducer.ts

@@ -2,17 +2,24 @@ import {
   INIT_SOURCEFILE,
   UPDATE_SOURCEFILE,
   CLEAR_SOURCEFILE,
+  HIGHLIGHT_NODE,
+  CLEAR_HIGHLIGHTED_NODES,
   SourceFilesState,
-  SourceFilesActionTypes
+  HighlightedNodesState,
+  SourceFilesActionTypes,
+  HighlightNodeActionTypes
 } from "./types";
 
-const initialState: SourceFilesState = {
+const initialSourceFileState: SourceFilesState = {
   inititalSourceFile: undefined,
   currentSourceFile: undefined
 };
+const initialHighlightedNodesState: HighlightedNodesState = {
+  nodes: []
+};
 
 export function sourceFilesReducer(
-  state = initialState,
+  state = initialSourceFileState,
   action: SourceFilesActionTypes
 ): SourceFilesState {
   switch (action.type) {
@@ -28,7 +35,24 @@ export function sourceFilesReducer(
         currentSourceFile: action.payload.sourceFile
       };
     case CLEAR_SOURCEFILE:
-      return initialState;
+      return initialSourceFileState;
+    default:
+      return state;
+  }
+}
+
+export function highlightedNodesReducer(
+  state = initialHighlightedNodesState,
+  action: HighlightNodeActionTypes
+): HighlightedNodesState {
+  switch (action.type) {
+    case HIGHLIGHT_NODE:
+      return {
+        ...state,
+        nodes: [...state.nodes, action.payload.node]
+      };
+    case CLEAR_HIGHLIGHTED_NODES:
+      return initialHighlightedNodesState;
     default:
       return state;
   }

lib/src/store/sourceFiles/types.ts

@@ -6,26 +6,46 @@ export interface SourceFilesState {
   currentSourceFile?: ts.SourceFile;
 }
 
+// slice for highlighted nodes
+export interface HighlightedNodesState {
+  nodes: ts.Node[];
+}
+
 // Describing the different ACTION NAMES available
 export const INIT_SOURCEFILE = "INIT_SOURCEFILE";
 export const UPDATE_SOURCEFILE = "UPDATE_SOURCEFILE";
 export const CLEAR_SOURCEFILE = "CLEAR_SOURCEFILE";
+export const HIGHLIGHT_NODE = "HIGHLIGHT_NODE";
+export const CLEAR_HIGHLIGHTED_NODES = "CLEAR_HIGHLIGHTED_NODES";
 
-interface InitSourceFileAction {
+export interface InitSourceFileAction {
   type: typeof INIT_SOURCEFILE;
   payload: { sourceFile: ts.SourceFile };
 }
 
-interface UpdateSourceFileAction {
+export interface UpdateSourceFileAction {
   type: typeof UPDATE_SOURCEFILE;
   payload: { sourceFile: ts.SourceFile };
 }
 
-interface ClearSourceFileAction {
+export interface ClearSourceFileAction {
   type: typeof CLEAR_SOURCEFILE;
 }
 
+export interface HighlightNodeAction {
+  type: typeof HIGHLIGHT_NODE;
+  payload: { node: ts.Node };
+}
+
+export interface ClearHighlightedNodesAction {
+  type: typeof CLEAR_HIGHLIGHTED_NODES;
+}
+
 export type SourceFilesActionTypes =
   | InitSourceFileAction
   | UpdateSourceFileAction
   | ClearSourceFileAction;
+
+export type HighlightNodeActionTypes =
+  | HighlightNodeAction
+  | ClearHighlightedNodesAction;