<commit_before><template>
  <AposModal
    :modal="modal" :modal-title="modalTitle"
    @esc="cancel" @no-modal="$emit('safe-close')"
    @inactive="modal.active = false" @show-modal="modal.showModal = true"
  >
    <template #primaryControls>
      <AposButton
        type="default" label="Finished"
        @click="cancel"
      />
    </template>
    <template #main>
      <AposModalBody>
        <template #bodyMain>
          <AposTree
            :rows="rows" :headers="headers"
            :icons="icons" :options="treeOptions"
            v-model="selected"
          />
        </template>
      </AposModalBody>
    </template>
  </AposModal>
</template>

<script>
import AposModalParentMixin from 'Modules/@apostrophecms/modal/mixins/AposModalParentMixin';
import AposTableMixin from 'Modules/@apostrophecms/modal/mixins/AposTableMixin';
import dayjs from 'dayjs';

export default {
  name: 'AposDocHistory',
  mixins: [ AposModalParentMixin, AposTableMixin ],
  props: {
    doc: {
      type: Object,
      required: true
    }
  },
  emits: [ 'trash', 'search', 'safe-close' ],
  data() {
    return {
      modalTitle: `${this.doc.title} Versions`,
      modal: {
        active: false,
        type: 'slide',
        showModal: false
      },
      versions: [],
      selected: [],
      options: {
        columns: [
          {
            label: 'Edited on',
            name: 'editedAt',
            labelIcon: 'calendar'
          },
          {
            label: 'Edited by',
            name: 'author',
            labelIcon: 'account-box'
          }
        ]
      },
      treeOptions: {
        hideHeader: true,
        selectable: true,
        startCollapsed: true
      }
    };
  },
  computed: {
    rows() {
      const rows = [];
      if (!this.versions || !this.headers.length) {
        return [];
      }

      this.versions.forEach(page => {
        const data = {};

        this.headers.forEach(column => {
          data[column.name] = page[column.name];
          data._id = page._id;
          data.children = page.children;
        });
        rows.push(data);
      });

      return rows;
    }
  },
  async mounted() {
    this.modal.active = true;

    await this.getVersions();
  },
  methods: {
    async getVersions () {
      let docVersions = (await apos.http.post(
        '/api/v1/@apostrophecms/version/list', {
          busy: true,
          body: {
            _id: this.doc._id
          }
        }
      )).versions;

      docVersions = this.formatVersions(docVersions);

      if (docVersions) {
        this.versions = docVersions;
      }
    },
    openEditor(event) {
      console.info('OPEN DOC TO EDIT', event);
    },
    formatVersions (versions) {
      const versionsTree = [];

      versions.forEach(version => {
        version.title = version.doc.title;

        const created = dayjs(version.createdAt);
        const matchIndex = versionsTree.findIndex(v => {
          return created.isSame(v.createdAt, 'day');
        });

        version.editedAt = this.formatDate(version.createdAt);<commit_msg>Adds restore button (#2316)<commit_after><template>
  <AposModal
    :modal="modal" :modal-title="modalTitle"
    @esc="cancel" @no-modal="$emit('safe-close')"
    @inactive="modal.active = false" @show-modal="modal.showModal = true"
  >
    <template #secondaryControls>
      <AposButton
        type="default" label="Exit"
        @click="cancel"
      />
    </template>
    <template #primaryControls>
      <AposButton
        type="primary" :label="restoreLabel"
        @click="restore" :disabled="latestVersion === selected[0]"
      />
    </template>
    <template #main>
      <AposModalBody>
        <template #bodyMain>
          <AposTree
            :rows="rows" :headers="headers"
            :icons="icons" :options="treeOptions"
            v-model="selected"
          />
        </template>
      </AposModalBody>
    </template>
  </AposModal>
</template>

<script>
import AposModalParentMixin from 'Modules/@apostrophecms/modal/mixins/AposModalParentMixin';
import AposTableMixin from 'Modules/@apostrophecms/modal/mixins/AposTableMixin';
import dayjs from 'dayjs';

export default {
  name: 'AposDocHistory',
  mixins: [ AposModalParentMixin, AposTableMixin ],
  props: {
    doc: {
      type: Object,
      required: true
    }
  },
  emits: [ 'trash', 'search', 'safe-close' ],
  data() {
    return {
      modalTitle: `${this.doc.title} Versions`,
      modal: {
        active: false,
        type: 'slide',
        showModal: false
      },
      versions: [],
      latestVersion: '',
      selected: [],
      options: {
        columns: [
          {
            label: 'Edited on',
            name: 'editedAt',
            labelIcon: 'calendar'
          },
          {
            label: 'Edited by',
            name: 'author',
            labelIcon: 'account-box'
          }
        ]
      },
      treeOptions: {
        hideHeader: true,
        selectable: true,
        startCollapsed: true
      }
    };
  },
  computed: {
    rows() {
      const rows = [];
      if (!this.versions || !this.headers.length) {
        return [];
      }

      this.versions.forEach(page => {
        const data = {};

        this.headers.forEach(column => {
          data[column.name] = page[column.name];
          data._id = page._id;
          data.children = page.children;
        });
        rows.push(data);
      });

      return rows;
    },
    restoreLabel() {
      return this.latestVersion === this.selected[0] ? 'Current version' : 'Restore';
    }
  },
  async mounted() {
    this.modal.active = true;

    await this.getVersions();
    this.selected = [ this.versions[0]._id ];
    this.latestVersion = this.versions[0]._id;
  },
  methods: {
    async getVersions () {
      let docVersions = (await apos.http.post(
        '/api/v1/@apostrophecms/version/list', {
          busy: true,
          body: {
            _id: this.doc._id
          }
        }
      )).versions;

      docVersions = this.formatVersions(docVersions);

      if (docVersions) {
        this.versions = docVersions;
      }
    },
    restore() {
      // TEMP: This will hit a POST or PATCH route in UI integration.
      // After a confirmation step, this should also trigger `cancel`.
      console.info(`Restore version ${this.selected[0]} for doc ${this.doc._id}`);
    },
    openEditor(event) {
      console.info('OPEN DOC TO EDIT', event);
    },
    formatVersions (versions) {
      const versionsTree = [];

      versions.forEach(version => {
        version.title = version.doc.title;

        const created = dayjs(version.createdAt);
        const matchIndex = versionsTree.findIndex(v => {
          return created.isSame(v.createdAt, 'day');
        });

        version.editedAt = this.formatDate(version.createdAt);
{'fraction_non_alphanumeric': 0.14016919486581098, 'fraction_numerical': 0.0016044340723453908, 'mean_word_length': 1.9671138035482476, 'pattern_counts': {'":': 0, '<': 36, '<?xml version=': 0, '>': 44, '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': '4265068', 'n_tokens_mistral': 2120, 'n_tokens_neox': 2084, 'n_words': 393}