import m , { ClassComponent , Vnode } from 'mithril' ; import { Store } from '../store/Store' ; import { ProxySettings } from '../domain/ProxySettings' ; class ProxyListModel { list : ProxySettings [ ] ; constructor ( ) { this . list = [ ] ; } async loadList ( ) { const store = ( window as any ) . store ; this . list = await store . getAllProxies ( ) ; } async delete ( id ) { const store = ( window as any ) . store ; await store . deleteProxyById ( id ) ; await this . loadList ( ) ; } } export class ProxyList implements ClassComponent { private readonly model : ProxyListModel ; constructor ( ) { this . model = new ProxyListModel ( ) ; } async oninit ( ) { await this . model . loadList ( ) ; m . redraw ( ) ; } view ( ) { const items = this . model . list . map ( this . renderProxyItem . bind ( this ) ) ; const actions = m ( 'div.ProxyList__list-actions' , [ m ( '.proxy-button' , [ m ( 'a[href=#!/proxies/new]' , { class : 'button button--primary' } , '+' ) ] ) ] ) ; return [ ... items , actions ] ; } renderProxyItem ( p ) { const text = m ( 'div.proxy-name' , [ ( p . title !== '' ) ? p . title : p . url ] ) ; const editButton = m ( 'a.button.edit' , { href : '#!/proxies/' + p . id } , browser . i18n . getMessage ( 'ProxyList_edit' ) ) ; const deleteButton = m ( 'button.delete[type=button]' , { onclick : async ( ) => { await this . model . delete ( p . id ) ; m . redraw ( ) ; } } , browser . i18n . getMessage ( 'ProxyList_delete' ) ) ; return m ( '.proxy-list-item' , [ text , m ( '.ProxyList__item-actions' , [ editButton , deleteButton ] ) ] ) ; } }