<template>
  <footer class="footer p-10 bg-secondary text-neutral-content">
    <nav>
      <h6 class="footer-title">Social</h6>
      <a class="link link-hover" href="https://www.facebook.com/auburnoil">Facebook</a>
      <a class="link link-hover" href="https://www.google.com/search?client=firefox-b-1-d&sca_esv=02c44965d6d4b280&sca_upv=1&cs=1&output=search&kgmid=/g/11wcbqrx5l&q=Auburn+Oil&shndl=30&shem=lsde&source=sh/x/loc/act/m1/1&kgs=52995d809762cd61">Google</a>
      <a class="link link-hover" href="https://auburnoil.com">Website</a>
    </nav>
    <nav>
      <h6 class="footer-title">Quick Call</h6>
      <div class="">WB Hill Tank Springfield - (413) 525-3678</div>
      <div class="">LW Tank Uxbridge - (508) 234-6000</div>
      <div class="">Trask Tank Worcester - (508) 791-5064</div>
      <div class="">David Mechanic  - (774) 239-3776</div>
      <div class="">Spring Rebuilders - (508) 799-9342</div>
    </nav>
    <nav>
      <h6 class="footer-title">Google Review link / qrcode</h6>
      <a class="link link-hover">https://g.page/r/CZHnPQ85LsMUEBM/review</a>
      <button @click="copyReviewLink" class="btn btn-outline btn-sm ml-2">Copy Link</button>
      <h6 class="link link-hover"> <img src="../../assets/images/googlereview.png" alt="Company Logo" class="h-10 w-auto" /></h6>
      <a class="link link-hover"></a>
    </nav>
  </footer>
</template>


<script setup lang="ts">
import { ref } from 'vue';

const copyReviewLink = async () => {
  try {
    await navigator.clipboard.writeText('https://g.page/r/CZHnPQ85LsMUEBM/review')
    alert('Link copied to clipboard!')
  } catch (err) {
    console.error('Failed to copy text: ', err)
    alert('Failed to copy link. Please try again.')
  }
};
</script>
<style></style>
