footer.tsx

import styles from "./styles.module.scss";
import Logo from "@/components/Logo/Logo";
import Link from "next/link";
import { getInfo } from "@/functions/data";

const Footer = async () => {
  const socials = await getInfo();

  return (
    <Reveal>
      <div className={styles.footer}>
        <div className={styles["content"]}>
          <div className={styles["left"]}>
            <Reveal>
              <p className={styles["copyright"]}>
                The Formante &copy; {new Date().getFullYear()}
              </p>
            </Reveal>
            <Reveal>
              <p className={styles["copyright"]}>
                Designed by {INFO.designedBy}
              </p>
            </Reveal>
          </div>
          <div className={styles["right"]}>
            <div className={styles["contact-info"]}>
              <Reveal>
                <div className={styles["contact-group"]}>
                  <p className={styles["title"]}>Email</p>
                  <p className={styles["label"]}>
                    {socials
                      ? !socials.email
                        ? INFO.email
                        : socials.email
                      : INFO.email}
                  </p>
                </div>
              </Reveal>
          </div>
        </div>
      </div>
    </Reveal>
  );
};

export default Footer;

data.ts

export async function getInfo() {
  try {
    const socials = await prisma.information.findFirst({});
    return socials;
  } catch (error) {
    console.error("Error in getInfo:", error);
    return {
      _id: "",
      youtube: "",
      spotify: "",
      apple: "",
      email: "",
      instagram: "",
      phone: "",
      twitter: "",
    };
  }
}

This works as expected in development, but in production, it doesnt update the data where there are changes in the values. It just shows the values which were there while the deployment.