<commit_before><template>
  <div>
    <h2 class="title">Add your workout</h2>
      <form>
        <input v-model="name" type="text" class="input" placeholder="Name it">
        <textarea v-model="description" type="text" class="input" placeholder="Describe it"></textarea>
        <div class="image-upload">
          <label class="title" for="imageFile">Add an image</label>
          <input @change="filesChange($event.target.files)" type="file" multiple class="form-control-file" ref="imageFile">
        </div>
        <div class="row">
          <div class="col">
            <button @click="onCancel" type="button" class="button button-primary">Cancel</button>
          </div>
          <div class="col">
            <button @click="onCreateNew" type="submit" class="button button-primary">Apply</button>
          </div>
        </div>
      </form>
  </div>
</template>
<script>
  import {mapActions} from 'vuex'

  export default {
    data () {
      return {
        name: '',
        description: '',
        pictures: []
      }
    },
    methods: {
      ...mapActions(['createNewWorkout', 'uploadImages']),
      filesChange (files) {
        this.pictures = [...files]
      },
      reset () {
        this.name = ''
        this.description = ''
        this.pictures = []
        this.$refs.imageFile.value = null
      },
      onCancel (ev) {
        ev.preventDefault()
        ev.stopPropagation()
        this.reset()
      },
      onCreateNew (ev) {
        ev.preventDefault()
        ev.stopPropagation()
        if (this.name.length > 0 && this.description.length > 0 && this.pictures.length > 0) {
          this.uploadImages(this.pictures).then(picUrls => {
            this.createNewWorkout({
              name: this.name,
              description: this.description,
              pictures: picUrls
            })
            this.reset()
          })
        }
      }
    }
  }
</script>
<style scoped lang="scss">
  @import "../../assets/styles/main";

  .image-upload {
    margin: 40px 0;
  }
</style><commit_msg>hiding action buttons on create new workout while the workout is being created<commit_after><template>
  <div>
    <h2 class="title">Add your workout</h2>
      <form>
        <input v-model="name" type="text" class="input" placeholder="Name it">
        <textarea v-model="description" type="text" class="input" placeholder="Describe it"></textarea>
        <div class="image-upload">
          <label class="title" for="imageFile">Add an image</label>
          <input @change="filesChange($event.target.files)" type="file" multiple class="form-control-file" ref="imageFile">
        </div>
        <div class="row">
          <div class="col">
            <button v-show="!isCreating" @click="onCancel" type="button" class="button button-primary">Cancel</button>
          </div>
          <div class="col">
            <button v-show="!isCreating" @click="onCreateNew" type="submit" class="button button-primary">Apply</button>
          </div>
        </div>
      </form>
  </div>
</template>
<script>
  import {mapActions} from 'vuex'

  export default {
    data () {
      return {
        name: '',
        description: '',
        pictures: [],
        isCreating: false
      }
    },
    methods: {
      ...mapActions(['createNewWorkout', 'uploadImages']),
      filesChange (files) {
        this.pictures = [...files]
      },
      reset () {
        this.name = ''
        this.description = ''
        this.pictures = []
        this.$refs.imageFile.value = null
      },
      onCancel (ev) {
        ev.preventDefault()
        ev.stopPropagation()
        this.reset()
      },
      onCreateNew (ev) {
        this.isCreating = true
        ev.preventDefault()
        ev.stopPropagation()
        if (this.name.length > 0 && this.description.length > 0 && this.pictures.length > 0) {
          this.uploadImages(this.pictures).then(picUrls => {
            this.createNewWorkout({
              name: this.name,
              description: this.description,
              pictures: picUrls
            }).then(() => {
              this.reset()
              this.isCreating = false
            })
          })
        } else {
          this.isCreating = false
        }
      }
    }
  }
</script>
<style scoped lang="scss">
  @import "../../assets/styles/main";

  .image-upload {
    margin: 40px 0;
  }
</style>
{'fraction_non_alphanumeric': 0.15634956759217114, 'fraction_numerical': 0.0036413290851160674, 'mean_word_length': 1.965587044534413, 'pattern_counts': {'":': 0, '<': 63, '<?xml version=': 0, '>': 72, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '241796', 'n_tokens_mistral': 1301, 'n_tokens_neox': 1282, 'n_words': 255}