DevTools Actions

/**
 * Wraps user actions with timestamp for devtools processing
 */
class PerformAction implements Action {
  readonly type = 'PERFORM_ACTION';
  
  /**
   * @param action - The user action to perform
   * @param timestamp - Timestamp when action occurred
   * @throws Error if action.type is undefined
   */
  constructor(public action: Action, public timestamp: number);
}

import { PerformAction } from "@ngrx/store-devtools";
import { MyAction } from "./my-actions";

const userAction = new MyAction({ data: "example" });
const devtoolsAction = new PerformAction(userAction, Date.now());

/**
 * Refresh the devtools display
 */
class Refresh implements Action {
  readonly type = 'REFRESH';
}

/**
 * Reset devtools to initial state
 */
class Reset implements Action {
  readonly type = 'RESET';
  
  /**
   * @param timestamp - Timestamp when reset occurred
   */
  constructor(public timestamp: number);
}

/**
 * Rollback to previous committed state
 */
class Rollback implements Action {
  readonly type = 'ROLLBACK';
  
  /**
   * @param timestamp - Timestamp when rollback occurred
   */
  constructor(public timestamp: number);
}

/**
 * Commit current state as new baseline
 */
class Commit implements Action {
  readonly type = 'COMMIT';
  
  /**
   * @param timestamp - Timestamp when commit occurred
   */
  constructor(public timestamp: number);
}

/**
 * Remove all skipped actions from history
 */
class Sweep implements Action {
  readonly type = 'SWEEP';
}

/**
 * Toggle an action between active and inactive state
 */
class ToggleAction implements Action {
  readonly type = 'TOGGLE_ACTION';
  
  /**
   * @param id - ID of the action to toggle
   */
  constructor(public id: number);
}

/**
 * Set a range of actions as active or inactive
 */
class SetActionsActive implements Action {
  readonly type = 'SET_ACTIONS_ACTIVE';
  
  /**
   * @param start - Starting action ID
   * @param end - Ending action ID
   * @param active - Whether to set actions as active (default: true)
   */
  constructor(public start: number, public end: number, public active = true);
}

/**
 * Jump to a specific state by index
 */
class JumpToState implements Action {
  readonly type = 'JUMP_TO_STATE';
  
  /**
   * @param index - Index of the state to jump to
   */
  constructor(public index: number);
}

/**
 * Jump to a specific action by ID
 */
class JumpToAction implements Action {
  readonly type = 'JUMP_TO_ACTION';
  
  /**
   * @param actionId - ID of the action to jump to
   */
  constructor(public actionId: number);
}

/**
 * Import a previously exported state
 */
class ImportState implements Action {
  readonly type = 'IMPORT_STATE';
  
  /**
   * @param nextLiftedState - The lifted state to import
   */
  constructor(public nextLiftedState: any);
}

/**
 * Lock or unlock state changes
 */
class LockChanges implements Action {
  readonly type = 'LOCK_CHANGES';
  
  /**
   * @param status - True to lock changes, false to unlock
   */
  constructor(public status: boolean);
}

/**
 * Pause or resume action recording
 */
class PauseRecording implements Action {
  readonly type = 'PAUSE_RECORDING';
  
  /**
   * @param status - True to pause recording, false to resume
   */
  constructor(public status: boolean);
}

/** Constant for PerformAction type */
const PERFORM_ACTION = 'PERFORM_ACTION';

/** Constant for Refresh action type */
const REFRESH = 'REFRESH';

/** Constant for Reset action type */
const RESET = 'RESET';

/** Constant for Rollback action type */
const ROLLBACK = 'ROLLBACK';

/** Constant for Commit action type */
const COMMIT = 'COMMIT';

/** Constant for Sweep action type */
const SWEEP = 'SWEEP';

/** Constant for ToggleAction type */
const TOGGLE_ACTION = 'TOGGLE_ACTION';

/** Constant for SetActionsActive type */
const SET_ACTIONS_ACTIVE = 'SET_ACTIONS_ACTIVE';

/** Constant for JumpToState type */
const JUMP_TO_STATE = 'JUMP_TO_STATE';

/** Constant for JumpToAction type */
const JUMP_TO_ACTION = 'JUMP_TO_ACTION';

/** Constant for ImportState type */
const IMPORT_STATE = 'IMPORT_STATE';

/** Constant for LockChanges type */
const LOCK_CHANGES = 'LOCK_CHANGES';

/** Constant for PauseRecording type */
const PAUSE_RECORDING = 'PAUSE_RECORDING';

/**
 * Union type of all devtools action classes
 */
type All = 
  | PerformAction
  | Refresh
  | Reset
  | Rollback
  | Commit
  | Sweep
  | ToggleAction
  | SetActionsActive
  | JumpToState
  | JumpToAction
  | ImportState
  | LockChanges
  | PauseRecording;

import { Injectable } from "@angular/core";
import { Store } from "@ngrx/store";
import { 
  StoreDevtools,
  Reset,
  Commit,
  JumpToAction,
  ToggleAction,
  LockChanges,
  PauseRecording 
} from "@ngrx/store-devtools";

@Injectable()
export class DevtoolsControlService {
  constructor(private devtools: StoreDevtools) {}

  // Reset to initial state
  resetToInitialState() {
    const resetAction = new Reset(Date.now());
    this.devtools.dispatch(resetAction);
  }

  // Commit current state
  commitCurrentState() {
    const commitAction = new Commit(Date.now());
    this.devtools.dispatch(commitAction);
  }

  // Jump to specific action
  jumpToActionById(actionId: number) {
    const jumpAction = new JumpToAction(actionId);
    this.devtools.dispatch(jumpAction);
  }

  // Toggle action active state
  toggleActionState(actionId: number) {
    const toggleAction = new ToggleAction(actionId);
    this.devtools.dispatch(toggleAction);
  }

  // Lock all changes
  lockAllChanges() {
    const lockAction = new LockChanges(true);
    this.devtools.dispatch(lockAction);
  }

  // Unlock all changes
  unlockAllChanges() {
    const lockAction = new LockChanges(false);
    this.devtools.dispatch(lockAction);
  }

  // Pause recording
  pauseRecording() {
    const pauseAction = new PauseRecording(true);
    this.devtools.dispatch(pauseAction);
  }

  // Resume recording
  resumeRecording() {
    const resumeAction = new PauseRecording(false);
    this.devtools.dispatch(resumeAction);
  }
}

import { Injectable } from "@angular/core";
import { Actions, ofType } from "@ngrx/effects";
import { tap } from "rxjs/operators";
import { 
  PERFORM_ACTION, 
  JUMP_TO_STATE, 
  COMMIT,
  PerformAction,
  JumpToState,
  Commit
} from "@ngrx/store-devtools";

@Injectable()
export class DevtoolsEffectsService {
  constructor(private actions$: Actions) {}

  // Log all user actions performed through devtools
  logPerformActions$ = this.actions$.pipe(
    ofType(PERFORM_ACTION),
    tap((action: PerformAction) => {
      console.log(`User action performed:`, action.action);
      console.log(`Timestamp:`, action.timestamp);
    })
  );

  // Handle time travel navigation
  handleTimeTravel$ = this.actions$.pipe(
    ofType(JUMP_TO_STATE),
    tap((action: JumpToState) => {
      console.log(`Jumped to state index:`, action.index);
      // Could trigger analytics, logging, etc.
    })
  );

  // Handle state commits
  handleCommits$ = this.actions$.pipe(
    ofType(COMMIT),
    tap((action: Commit) => {
      console.log(`State committed at:`, action.timestamp);
      // Could trigger persistence, backup creation, etc.
    })
  );
}