github.com/anth0d/nomad@v0.0.0-20221214183521-ae3a0a2cad06/ui/app/components/evaluation-sidebar/detail.js (about) 1 import { action } from '@ember/object'; 2 import Component from '@glimmer/component'; 3 import { tracked } from '@glimmer/tracking'; 4 import d3 from 'd3'; 5 import { matchesState } from 'ember-statecharts'; 6 7 export default class Detail extends Component { 8 get statechart() { 9 return this.args.statechart; 10 } 11 12 @matchesState({ sidebar: 'open' }) 13 isSideBarOpen; 14 15 @matchesState({ sidebar: { open: 'success' } }) 16 isSuccess; 17 18 @matchesState({ sidebar: { open: 'busy' } }) 19 isLoading; 20 21 @matchesState({ sidebar: { open: 'error' } }) 22 isError; 23 24 @tracked width = null; 25 @tracked height = null; 26 27 @action 28 handleResize({ target: { scrollWidth: width, scrollHeight: height } }) { 29 if (width === this.width || height === this.height) return; 30 this.height = height; 31 this.width = width; 32 } 33 34 get currentEvalDetail() { 35 return this.statechart.state.context.evaluation; 36 } 37 38 get hierarchy() { 39 try { 40 const data = this.currentEvalDetail?.relatedEvals; 41 42 if (data) { 43 return d3 44 .stratify() 45 .id((d) => { 46 return d.id; 47 }) 48 .parentId((d) => d.previousEval)([ 49 ...data.toArray(), 50 this.currentEvalDetail, 51 ]); 52 } 53 } catch (e) { 54 console.error(`\n\nRelated Evaluation Error: ${e.message}`); 55 } 56 return null; 57 } 58 59 get descendentsMap() { 60 return this.hierarchy 61 ?.descendants() 62 .map((d) => d.children) 63 .compact(); 64 } 65 66 get parentEvaluation() { 67 return this.hierarchy?.data; 68 } 69 70 get error() { 71 return this.statechart.state.context.error; 72 } 73 74 @action 75 closeSidebar() { 76 return this.statechart.send('MODAL_CLOSE'); 77 } 78 79 keyCommands = [ 80 { 81 label: 'Close Evaluations Sidebar', 82 pattern: ['Escape'], 83 action: () => this.closeSidebar(), 84 }, 85 ]; 86 }