<commit_before><template>
  <button
    :class="{
      'pwa-button--brand': isBrand,
      'pwa-button--total_right': isRight
    }"
    @click="buildArchive(platform, parameters)"
  >
    <span v-if="isReady">
      <i v-if="!showMessage" class="fas fa-long-arrow-alt-down"></i>

      <span v-if="showMessage">{{ message$ }}</span>
    </span>

    <div id="colorSpinner" v-if="!isReady">
      <div class="flavor">
        <div class="colorbands"></div>
      </div>
      <div class="icon">
        <div class="lds-dual-ring"></div>
      </div>
    </div>

    <div id="errorDiv" v-if="errorMessage">{{ errorMessage }}</div>
  </button>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "nuxt-class-component";
import Loading from "~/components/Loading.vue";
import { Prop } from "vue-property-decorator";
import { Action, State, namespace } from "vuex-class";

import * as publish from "~/store/modules/publish";

const PublishState = namespace(publish.name, State);
const PublishAction = namespace(publish.name, Action);

import * as generator from "~/store/modules/generator";
const GeneratorState = namespace(generator.name, State);

import { generatePackageId } from '../utils/packageID';

@Component({
  components: {
    Loading
  }
})
export default class extends Vue {
  public isReady = true;
  public errorMessage = "";
  public siteHref: string = "/";

  @Prop({ type: String, default: "" })
  public readonly platform: string;

  @Prop({
    type: Array,
    default: function() {
      return [];
    }
  })
  public readonly parameters: string[];

  @Prop({ type: Boolean, default: false })
  public readonly isBrand: boolean;

  @Prop({ type: Boolean, default: false })
  public readonly isRight: boolean;

  @Prop({ type: String, default: "" })
  private readonly message: string;
  public message$ = "";

  @Prop({ type: Boolean, default: false })
  public showMessage: boolean;

  @PublishState archiveLink: string;
  @PublishAction build;

  @GeneratorState manifest: generator.Manifest;

  public created(): void {
    this.message$ = this.message;

    const sessionRef = sessionStorage.getItem("currentURL");
    if (sessionRef) {
      this.siteHref = sessionRef;
    }
  }

  async handleTWA() {
    this.isReady = false;

    const goodIcon = (this.manifest as any).icons.find(
      icon => icon.sizes.includes("512") || icon.sizes.includes("192")
    );

    const packageid = generatePackageId((this.manifest.short_name as string) || (this.manifest.name as string));

    let startURL = (this.manifest.start_url as string).replace(`https://${new URL(this.siteHref).hostname}`, "")


    const body = JSON.stringify({
      packageId: `com.${packageid.split(' ').join('_').toLowerCase()}`,
      host: new URL(this.siteHref).hostname,
      name: this.manifest.short_name || this.manifest.name,
      themeColor: this.manifest.theme_color || this.manifest.background_color,
      navigationColor:
        this.manifest.theme_color || this.manifest.background_color,
      backgroundColor:
        this.manifest.background_color || this.manifest.theme_color,
      startUrl: startURL,
      iconUrl: goodIcon.src,
      maskableIconUrl: goodIcon.src,
      appVersion: "1.0.0",
      useBrowserOnChromeOS: true,
      splashScreenFadeOutDuration: 300,
      enableNotifications: false,
      shortcuts: "[]",
      signingInfo: {
        fullName: "<NAME>",
        organization: "Contoso",
        organizationalUnit: "Engineering Department",
        countryCode: "US"
      }
    });

    try {
      const response = await fetch(
        "https://pwabuilder-cloudapk.azurewebsites.net/generateSignedApkZip",
        {
          method: "POST",
          headers: {
            "Content-Type": "application/json"
          },
          body: body
        }
      );
      const data = await response.blob();

      let url = window.URL.createObjectURL(data);<commit_msg>fix(): fixes #673 (#679)<commit_after><template>
  <button
    :class="{
      'pwa-button--brand': isBrand,
      'pwa-button--total_right': isRight
    }"
    @click="buildArchive(platform, parameters)"
  >
    <span v-if="isReady">
      <i v-if="!showMessage" class="fas fa-long-arrow-alt-down"></i>

      <span v-if="showMessage">{{ message$ }}</span>
    </span>

    <div id="colorSpinner" v-if="!isReady">
      <div class="flavor">
        <div class="colorbands"></div>
      </div>
      <div class="icon">
        <div class="lds-dual-ring"></div>
      </div>
    </div>

    <div id="errorDiv" v-if="errorMessage">{{ errorMessage }}</div>
  </button>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "nuxt-class-component";
import Loading from "~/components/Loading.vue";
import { Prop } from "vue-property-decorator";
import { Action, State, namespace } from "vuex-class";

import * as publish from "~/store/modules/publish";

const PublishState = namespace(publish.name, State);
const PublishAction = namespace(publish.name, Action);

import * as generator from "~/store/modules/generator";
const GeneratorState = namespace(generator.name, State);

import { generatePackageId } from '../utils/packageID';

@Component({
  components: {
    Loading
  }
})
export default class extends Vue {
  public isReady = true;
  public errorMessage = "";
  public siteHref: string = "/";

  @Prop({ type: String, default: "" })
  public readonly platform: string;

  @Prop({
    type: Array,
    default: function() {
      return [];
    }
  })
  public readonly parameters: string[];

  @Prop({ type: Boolean, default: false })
  public readonly isBrand: boolean;

  @Prop({ type: Boolean, default: false })
  public readonly isRight: boolean;

  @Prop({ type: String, default: "" })
  private readonly message: string;
  public message$ = "";

  @Prop({ type: Boolean, default: false })
  public showMessage: boolean;

  @PublishState archiveLink: string;
  @PublishAction build;

  @GeneratorState manifest: generator.Manifest;

  public created(): void {
    this.message$ = this.message;

    const sessionRef = sessionStorage.getItem("currentURL");
    if (sessionRef) {
      this.siteHref = sessionRef;
    }
  }

  async handleTWA() {
    this.isReady = false;

    const goodIcon = (this.manifest as any).icons.find(
      icon => icon.sizes.includes("512") || icon.sizes.includes("192")
    );

    const packageid = generatePackageId((this.manifest.short_name as string) || (this.manifest.name as string));

    let startURL = (this.manifest.start_url as string).replace(`https://${new URL(this.siteHref).hostname}`, "");

    let manifestURL = new URL((this.manifest.start_url as string));

    if (manifestURL.search && startURL.length > 0) {
      startURL = `${startURL}${manifestURL.search}`
    };

    const body = JSON.stringify({
      packageId: `com.${packageid.split(' ').join('_').toLowerCase()}`,
      host: new URL(this.siteHref).hostname,
      name: this.manifest.short_name || this.manifest.name,
      themeColor: this.manifest.theme_color || this.manifest.background_color,
      navigationColor:
        this.manifest.theme_color || this.manifest.background_color,
      backgroundColor:
        this.manifest.background_color || this.manifest.theme_color,
      startUrl: startURL && startURL.length > 0 ? startURL : `${manifestURL.search ? '/' + manifestURL.search : "/"}`,
      iconUrl: goodIcon.src,
      maskableIconUrl: goodIcon.src,
      appVersion: "1.0.0",
      useBrowserOnChromeOS: true,
      splashScreenFadeOutDuration: 300,
      enableNotifications: false,
      shortcuts: "[]",
      signingInfo: {
        fullName: "<NAME>",
        organization: "Contoso",
        organizationalUnit: "Engineering Department",
        countryCode: "US"
      }
    });

    try {
      const response = await fetch(
        "https://pwabuilder-cloudapk.azurewebsites.net/generateSignedApkZip",
        {
          method: "POST",
          headers: {
            "Content-Type": "application/json"
          },
          body: body
        }
      );
      const data = await response.blob();

      let url = window.URL.createObjectURL(data);
{'fraction_non_alphanumeric': 0.1484298331697743, 'fraction_numerical': 0.003925417075564278, 'mean_word_length': 3.1114473020675746, 'pattern_counts': {'":': 2, '<': 51, '<?xml version=': 0, '>': 55, 'https://': 4, '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': '1036971', 'n_tokens_mistral': 2544, 'n_tokens_neox': 2451, 'n_words': 565}