<template lang="html">
  <div class="layout align-center justify-start">
    <property-icon
      v-if="!hideIcon"
      class="mr-2"
      :model="model"
      :color="model.color"
      :class="selected && 'primary--text'"
    />
    <div class="text-no-wrap text-truncate">
      {{ name }}
    </div>
  </div>
</template>

<script lang="js">
import treeNodeViewMixin from '/imports/ui/properties/treeNodeViews/treeNodeViewMixin.js';

export default {
  mixins: [treeNodeViewMixin],
  computed: {
    name(){
      switch(this.model.branchType){
        case 'if': return 'On condition';
        case 'hit': return 'On hit';
        case 'miss': return 'On miss';
        case 'failedSave': return 'On failed save';
        case 'successfulSave': return 'On save';
        case 'eachTarget': return 'Each target';
        case 'random': return 'Pick one at random';
        default: return '';
      }
    }
  }
}
</script>
