// ========== FIREBASE LIKE BUTTON WITH GOOGLE LOGIN ==========
import { initializeApp } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-app.js";
import { getDatabase, ref, onValue, set, get, update } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-database.js";
import { getAuth, signInWithPopup, GoogleAuthProvider, onAuthStateChanged } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-auth.js";

// === KONFIGURASI FIREBASE MILIKMU ===
const firebaseConfig = {
  apiKey: "AIzaSyDlRMXDVn1HwL6QcM1mkl0i6IECtt16aO4",
  authDomain: "blog-like-app.firebaseapp.com",
  databaseURL: "https://blog-like-app-default-rtdb.asia-southeast1.firebasedatabase.app",
  projectId: "blog-like-app",
  storageBucket: "blog-like-app.firebasestorage.app",
  messagingSenderId: "212200120665",
  appId: "1:212200120665:web:263a8dff9353f1d7ac2c48"
};

// === Inisialisasi Firebase ===
const app = initializeApp(firebaseConfig);
const db = getDatabase(app);
const auth = getAuth(app);
const provider = new GoogleAuthProvider();

// === Fungsi Login Google ===
async function loginGoogle() {
  try {
    const result = await signInWithPopup(auth, provider);
    return result.user;
  } catch (e) {
    console.error("Login gagal:", e);
    return null;
  }
}

// === Jalankan setelah halaman siap ===
document.addEventListener("DOMContentLoaded", () => {
  const likeBoxes = document.querySelectorAll(".like-btn-box");

  likeBoxes.forEach((box) => {
    const postId = box.id;
    const countEl = box.querySelector(".like-count");
    const postRef = ref(db, "likes/" + postId);

    // Update realtime
    onValue(postRef, (snapshot) => {
      const data = snapshot.val();
      countEl.textContent = data?.count || 0;
    });

    // Klik tombol suka
    box.addEventListener("click", async () => {
      let user = auth.currentUser;
      if (!user) {
        user = await loginGoogle();
        if (!user) return;
      }

      const uid = user.uid;
      const snapshot = await get(postRef);
      let data = snapshot.val() || { count: 0, users: {} };

      if (data.users && data.users[uid]) {
        // Sudah suka, batalkan
        data.count = Math.max(0, data.count - 1);
        delete data.users[uid];
        box.classList.remove("liked");
      } else {
        // Tambah suka
        data.count = (data.count || 0) + 1;
        if (!data.users) data.users = {};
        data.users[uid] = true;
        box.classList.add("liked");
      }

      await set(postRef, data);
    });
  });
});

// === Tambahan gaya CSS otomatis ===
const style = document.createElement("style");
style.textContent = `
.like-btn-box {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #eee;
  padding: 6px 10px;
  border-radius: 10px;
  cursor: pointer;
  transition: 0.2s;
}
.like-btn-box.liked {
  background: #1976d2;
  color: #fff;
}
.like-btn-box .thumb {
  font-size: 18px;
}
`;
document.head.appendChild(style);