Series to implement a new version of WordTutor using techniques relevant to WPF in 2019

Need a context post that updates naming etc and clarifies where everything sits

Add Word Screen o Not clear that this is a model, not a screen

Add Word View Model o tests should reference _viewModel not _model

Word Browser

o Display all the words currently present o Current selection goes on the screen o Add basic model, view model, and model in one go (no need in repetition)

o Expose the word list as an observable collection o Initially replace the whole list each time o But flag flicker issue o Update current selection

o ListView

Screen Interaction

o Add moving back and forth between screens

somewhere in here, commands and command binding

Modify Word

o Separate screen to modify an existing word o Additional interaction

Validation

o Want to ensure that our new words are properly defined o Validation logic goes in the VocabularyWord o Use of validation goes in the reducer o Validation messages stored on the screen o Reuse of ValidationResult

Persistence

o Desire to avoid tight coupling o IObjectReader and IObjectWriter o Using Result to make error handling clean

Result

o Want to support warnings as well as errors ? Can I declare T + ValidationResult => Result ?

JSon Persistence

o Implementations of IObjectReader and IObjectWriter

Code Analysis Packages

o others?

Redux Pattern

o All application state captured by an immutable object o Some JS implementations use a property bag o Should we? o

Application Model

o Contains VocabularySet + FileInfo + ModifiedFlag o Simple messages

Workflows

o async methods for app updates that take more than a moment o Workflow messages

Screens

o Extend app with stack of screens, top one active

Azure Devops Pipelines

o Set up online builds, triggered by commits

Set up .editorconfig for enforced consistency https://www.hanselman.com/blog/EditorConfigCodeFormattingFromTheCommandLineWithNETCoresDotnetFormatGlobalTool.aspx

Class Diagram for Application State

[WordTutorApplication File: FileInfo;Modified: bool]
[VocabularyWord Spelling: string;Pronunciation: string;Phrase:string]
[VocabularySet Name: string]
[IScreen Title: string]

[WordTutorApplication]-CurrentVocabulary>[VocabularySet] [WordTutorApplication]-ScreenStack>[IScreen] [VocabularySet]<>-Words>[VocabularyWord]

Class Diagram for Redux Store

[ReduxStore State Dispatch(IReduxMessage)]–_reducer->[IReduxReducer]

[IReduxMessage]<>–[AddWord] [IReduxMessage]<>–[ModifyWord] [IReduxMessage]<>–[RemoveWord]

State diagram for Screen Flow

https://www.planttext.com/

@startuml

title Screen Flow

State “Word List” as WordList

WordList: SelectedWord

State “Create New Word” as CreateNewWord

CreateNewWord : Spelling CreateNewWord : Pronunciation CreateNewWord : Phrase

State “Modify Existing Word” as ModifyExistingWord

ModifyExistingWord : Spelling ModifyExistingWord : Pronunciation ModifyExistingWord : Phrase ModifyExistingWord : OriginalSpelling

WordList –> CreateNewWord : Add WordList –> ModifyExistingWord : Edit

CreateNewWord –> WordList : Save CreateNewWord –> WordList : Cancel

ModifyExistingWord –> WordList : Save ModifyExistingWord –> WordList : Cancel

@enduml

Redux Middleware