1
0

97732 Context help model, actions and reducer

This commit is contained in:
Koen Pauwels
2023-01-04 11:43:15 +01:00
parent 10bf18fe29
commit c156e1ca6f
5 changed files with 181 additions and 0 deletions

View File

@@ -0,0 +1,81 @@
import { Action } from '@ngrx/store';
import { type } from './ngrx/type';
import { ContextHelpModel } from './context-help.model';
export const ContextHelpActionTypes = {
'CONTEXT_HELP_TOGGLE_ICONS': type('dspace/context-help/CONTEXT_HELP_TOGGLE_ICONS'),
'CONTEXT_HELP_ADD': type('dspace/context-help/CONTEXT_HELP_ADD'),
'CONTEXT_HELP_REMOVE': type('dspace/context-help/CONTEXT_HELP_REMOVE'),
'CONTEXT_HELP_TOGGLE_TOOLTIP': type('dspace/context-help/CONTEXT_HELP_TOGGLE_TOOLTIP'),
'CONTEXT_HELP_SHOW_TOOLTIP': type('dspace/context-help/CONTEXT_HELP_SHOW_TOOLTIP'),
'CONTEXT_HELP_HIDE_TOOLTIP' : type('dspace/context-help/CONTEXT_HELP_HIDE_TOOLTIP'),
};
/**
* Toggles the visibility of all context help icons.
*/
export class ContextHelpToggleIconsAction implements Action {
type = ContextHelpActionTypes.CONTEXT_HELP_TOGGLE_ICONS;
}
/**
* Registers a new context help icon to the store.
*/
export class ContextHelpAddAction implements Action {
type = ContextHelpActionTypes.CONTEXT_HELP_ADD;
model: ContextHelpModel;
constructor (model: ContextHelpModel) {
this.model = model;
}
}
/**
* Removes a context help icon from the store.
*/
export class ContextHelpRemoveAction implements Action {
type = ContextHelpActionTypes.CONTEXT_HELP_REMOVE;
id: string;
constructor(id: string) {
this.id = id;
}
}
export abstract class ContextHelpTooltipAction implements Action {
type;
id: string;
constructor(id: string) {
this.id = id;
}
}
/**
* Toggles the tooltip of a single context help icon.
*/
export class ContextHelpToggleTooltipAction extends ContextHelpTooltipAction {
type = ContextHelpActionTypes.CONTEXT_HELP_TOGGLE_TOOLTIP;
}
/**
* Shows the tooltip of a single context help icon.
*/
export class ContextHelpShowTooltipAction extends ContextHelpTooltipAction {
type = ContextHelpActionTypes.CONTEXT_HELP_SHOW_TOOLTIP;
}
/**
* Hides the tooltip of a single context help icon.
*/
export class ContextHelpHideTooltipAction extends ContextHelpTooltipAction {
type = ContextHelpActionTypes.CONTEXT_HELP_HIDE_TOOLTIP;
}
export type ContextHelpAction
= ContextHelpToggleIconsAction
| ContextHelpAddAction
| ContextHelpRemoveAction
| ContextHelpToggleTooltipAction
| ContextHelpShowTooltipAction
| ContextHelpHideTooltipAction;

View File

@@ -0,0 +1,4 @@
export class ContextHelpModel {
id: string;
tooltipVisible?: boolean = false;
}

View File

@@ -0,0 +1,47 @@
import { ContextHelpModel } from './context-help.model';
import { ContextHelpAction, ContextHelpActionTypes } from './context-help.actions';
export type ContextHelpModels = {
[id: string]: ContextHelpModel;
};
export interface ContextHelpState {
allIconsVisible: boolean;
models: ContextHelpModels;
}
export function contextHelpReducer(state: ContextHelpState, action: ContextHelpAction): ContextHelpState {
switch (action.type) {
case ContextHelpActionTypes.CONTEXT_HELP_TOGGLE_ICONS: {
return {...state, allIconsVisible: true};
}
case ContextHelpActionTypes.CONTEXT_HELP_ADD: {
const newModels = {...state.models, [action.model.id]: action.model};
return {...state, models: newModels};
}
case ContextHelpActionTypes.CONTEXT_HELP_REMOVE: {
const {[action.id]: _, ...remainingModels} = state.models;
return {...state, models: remainingModels};
}
case ContextHelpActionTypes.CONTEXT_HELP_TOGGLE_TOOLTIP: {
return modifyTooltipVisibility(state, action.id, v => !v);
}
case ContextHelpActionTypes.CONTEXT_HELP_SHOW_TOOLTIP: {
return modifyTooltipVisibility(state, action.id, _ => true);
}
case ContextHelpActionTypes.CONTEXT_HELP_HIDE_TOOLTIP: {
return modifyTooltipVisibility(state, action.id, _ => false);
}
default: {
return state;
}
}
}
function modifyTooltipVisibility(state: ContextHelpState, id: string, modify: (vis: boolean) => boolean)
: ContextHelpState {
const {[id]: matchingModel, ...otherModels} = state.models;
const modifiedModel = {...matchingModel, tooltipVisible: modify(matchingModel.tooltipVisible)};
const newModels = {...otherModels, [id]: modifiedModel};
return {...state, models: newModels};
}

View File

@@ -0,0 +1,16 @@
import { TestBed } from '@angular/core/testing';
import { ContextHelpService } from './context-help.service';
describe('ContextHelpService', () => {
let service: ContextHelpService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(ContextHelpService);
});
it('should be created', () => {
expect(service).toBeTruthy();
});
});

View File

@@ -0,0 +1,33 @@
import { Injectable } from '@angular/core';
import { ContextHelpModel } from './context-help.model';
@Injectable({
providedIn: 'root'
})
export class ContextHelpService {
constructor() { }
toggleIcons() {
}
add(contextHelp: ContextHelpModel) {
}
remove(id: string) {
}
showTooltip(id: string) {
}
hideTooltip(id: string) {
}
toggleTooltip(id: string) {
}
}