<commit_before><template>
  <section class="section tasks">

    <md-layout :md-gutter="16" class="fixGutter">
      <md-layout class="task__block" md-flex="25"  md-flex-medium="50" md-flex-xsmall="100" v-for="(task, index) in tasks" :key="index">
        <md-card class="md-flex task">
          <md-card-header>

            <md-card-header-text>
              <div class="md-title">{{ task.title }}</div>
              <div class="md-subhead">{{ dateFromNow(task.createdAt) }}</div>
            </md-card-header-text>

            <md-button
              class="md-icon-button"
              :class="{'md-accent': task.starredToTask}"
              @click.native="startTask(task.id, index)"
            >
              <md-icon class="md-primary">star</md-icon>
            </md-button>

            <md-menu md-size="4" md-direction="bottom left">
              <md-button class="md-icon-button" md-menu-trigger>
                <md-icon>more_vert</md-icon>
              </md-button>

              <md-menu-content>
                <md-menu-item @click.native="$router.push('/tasks/' + task.id)">
                  <span>Edit</span>
                  <md-icon>mode_edit</md-icon>
                </md-menu-item>

                <md-menu-item @click.native="deleteTask(task.id)">
                  <span>Delete</span>
                  <md-icon>delete</md-icon>
                </md-menu-item>

                <md-menu-item @click.native="completeTask(task.id)">
                  <span>Complete</span>
                  <md-icon>done</md-icon>
                </md-menu-item>
              </md-menu-content>
            </md-menu>
          </md-card-header>

          <md-card-content>
            {{ task.description }}
          </md-card-content>

          <md-card-content>
            <h3 class="md-subheading">Expiration</h3>
            <div class="md-subhead">Into 15 hours</div>
          </md-card-content>
        </md-card>
      </md-layout>

    </md-layout>

  </section>
</template>

<script>
import moment from 'moment';
import TasksService from '../../services/tasksService';

export default {
  name: 'tasks',
  data() {
    return {
      tasks: []
    };
  },
  created() {
    TasksService.getAlltasks()
    .then((response) => {
      this.tasks = response.data.data.tasks;
    }).catch((error) => {
      console.log(error);
    });
  },
  methods: {
    dateFromNow(date) {
      return moment(date).fromNow();
    },
    completeTask(id) {
      TasksService.completeTask(id)
      .then((response) => {
        console.log(response);
      }).catch((error) => {
        console.log(error);
      });
    },
    deleteTask(id) {
      TasksService.deleteTask(id)
      .then((response) => {
        console.log(response);
      }).catch((error) => {
        console.log(error);
      });
    },
    startTask(id, index) {
      TasksService.starTask(id)
      .then((response) => {
        if (response.data.data.id) {
          this.tasks[index].starredToTask = true;
        } else {
          this.tasks[index].starredToTask = null;
        }
      }).catch((error) => {
        console.log(error);
      });
    }
  }
};
</script>

<style scoped>
  /*.task__block {
    margin: 10px 0px;
  }*/

  .task {
    margin: 10px 0px;
  }
</style>
<commit_msg>task style if date is passed<commit_after><template>
  <section class="section tasks">

    <md-layout :md-gutter="16" class="fixGutter">
      <md-layout
        class="task__block"
        md-flex="25"
        md-flex-medium="50"
        md-flex-xsmall="100"
        v-for="(task, index) in tasks" :key="index"
      >
        <md-card class="md-flex task" :class="taskStatus(task)">
          <md-card-header>

            <md-card-header-text>
              <div class="md-title">{{ task.title }}</div>
              <div class="md-subhead">{{ dateFromNow(task.createdAt) }}</div>
            </md-card-header-text>

            <md-button
              class="md-icon-button"
              :class="{'md-accent': task.starredToTask}"
              @click.native="startTask(task.id, index)"
            >
              <md-icon class="md-primary">star</md-icon>
            </md-button>

            <md-menu md-size="4" md-direction="bottom left">
              <md-button class="md-icon-button" md-menu-trigger>
                <md-icon>more_vert</md-icon>
              </md-button>

              <md-menu-content>
                <md-menu-item @click.native="$router.push('/tasks/' + task.id)">
                  <span>Edit</span>
                  <md-icon>mode_edit</md-icon>
                </md-menu-item>

                <md-menu-item @click.native="deleteTask(task.id)">
                  <span>Delete</span>
                  <md-icon>delete</md-icon>
                </md-menu-item>

                <md-menu-item @click.native="completeTask(task.id)">
                  <span>Complete</span>
                  <md-icon>done</md-icon>
                </md-menu-item>
              </md-menu-content>
            </md-menu>
          </md-card-header>

          <md-card-content>
            {{ task.description }}
          </md-card-content>

          <md-card-content>
            <h3 class="md-subheading">Expiration</h3>
            <div class="md-subhead">{{ dateFromNow(task.limitDate) }}</div>
          </md-card-content>
        </md-card>
      </md-layout>

    </md-layout>
  </section>
</template>

<script>
import moment from 'moment';
import TasksService from '../../services/tasksService';

export default {
  name: 'tasks',
  data() {
    return {
      tasks: []
    };
  },
  created() {
    TasksService.getAlltasks()
    .then((response) => {
      this.tasks = response.data.data.tasks;
    }).catch((error) => {
      console.log(error);
    });
  },
  methods: {
    dateFromNow(date) {
      return moment(date).fromNow();
    },
    completeTask(id) {
      TasksService.completeTask(id)
      .then((response) => {
        console.log(response);
      }).catch((error) => {
        console.log(error);
      });
    },
    deleteTask(id) {
      TasksService.deleteTask(id)
      .then((response) => {
        console.log(response);
      }).catch((error) => {
        console.log(error);
      });
    },
    startTask(id, index) {
      TasksService.starTask(id)
      .then((response) => {
        if (response.data.data.id) {
          this.tasks[index].starredToTask = true;
        } else {
          this.tasks[index].starredToTask = null;
        }
      }).catch((error) => {
        console.log(error);
      });
    },
    taskStatus(task) {
      const currentDate = new Date();
      console.log(currentDate);
      if (moment(currentDate).isAfter(task.limitDate, 'days')) {
        return 'md-accent';
      } else if (moment(currentDate).isSame(task.limitDate, 'days')) {
        return 'md-warn';
      }
      return '';
    }
  }
};
</script>

<style scoped>
  /*.task__block {
    margin: 10px 0px;
  }*/

  .task {
    margin: 10px 0px;
  }
</style>

{'fraction_non_alphanumeric': 0.17386963343317643, 'fraction_numerical': 0.005420054200542005, 'mean_word_length': 1.6927803379416282, 'pattern_counts': {'":': 0, '<': 123, '<?xml version=': 0, '>': 139, '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': '6863349', 'n_tokens_mistral': 2299, 'n_tokens_neox': 2212, 'n_words': 322}