feat(studio): rename Site Settings to Company Info

README.md

@@ -101,24 +101,24 @@ This project includes a customized Sanity Studio desk structure to enhance conte
 
 ## Managing Content
 
-### Site Settings
+### Company Info
 
-The `Site Settings` menu allows you to configure global settings for your site, including brand assets, tracking codes, and default SEO settings.
+The `Company Info` menu allows you to configure global settings for your site, including brand assets, tracking codes, and default SEO settings.
 
-#### Social Media Profiles
+### Social Media Profiles
 
 - **Adding Social Media Links**: Editors can manage social media links under the `Social Media Profiles` menu. This allows visitors to connect with the website on various social platforms.
 - **Supported Platforms**: The 9 supported platforms include Facebook, Instagram, and LinkedIn, but more can be added to `SoMePlatforms` if needed.
 
-#### Navigation Management
+### Navigation Management
 
 - **Setting the Landing Page**: The `Navigation Manager` allows editors to set the landing page for the site, which is crucial for determining the primary page visitors see upon arrival.
 - **Adding Menu Items**: Within the `Navigation Manager`, editors can add items to various pre-defined menus:
   - **Main Menu**: Add links and a single Call to Action (if needed) to the main menu, which appears at the top of the website. This helps visitors navigate to important sections.
   - **Footer Menu**: Add items to the footer menu, which consists of different sections. Each section can contain either social media links, custom links, text, or images (e.g., logos).
   - **Sidebar Menu**: Add links to the sidebar menu, which will appear on smaller screens to aid mobile navigation.
 
-#### Pages
+### Pages
 
 - **Creating Pages**: Content editors can create and manage pages under the `Pages` menu in the Sanity Studio.
 - **Adding Sections**: Each page can be customized with structured content that includes various predefined sections such as hero, article, testimonials, features, callToAction, grid, and callout.

src/app/(main)/layout.tsx

@@ -1,9 +1,9 @@
 import Footer from "src/components/navigation/footer/Footer";
 import { NAV_QUERY } from "studio/lib/queries/navigation";
-import { SITESETTINGS_QUERY } from "studio/lib/queries/siteSettings";
+import { COMPANY_INFO_QUERY } from "studio/lib/queries/companyInfo";
 import { Header } from "src/components/navigation/header/Header";
 import { Navigation } from "studio/lib/payloads/navigation";
-import { SiteSettings } from "studio/lib/payloads/siteSettings";
+import { CompanyInfo } from "studio/lib/payloads/companyInfo";
 import { loadQuery } from "studio/lib/store";
 import HeaderPreview from "src/components/navigation/header/HeaderPreview";
 import FooterPreview from "src/components/navigation/footer/FooterPreview";
@@ -24,22 +24,22 @@ export default async function Layout({
 }>) {
   const { perspective, isDraftMode } = getDraftModeInfo();
 
-  const [initialNav, initialSiteSettings, initialSoMe, initialLegal] =
+  const [initialNav, initialCompanyInfo, initialSoMe, initialLegal] =
     await Promise.all([
       loadQuery<Navigation>(NAV_QUERY, {}, { perspective }),
-      loadQuery<SiteSettings>(SITESETTINGS_QUERY, {}, { perspective }),
+      loadQuery<CompanyInfo>(COMPANY_INFO_QUERY, {}, { perspective }),
       loadQuery<SocialMediaProfiles>(SOMEPROFILES_QUERY, {}, { perspective }),
       loadQuery<LegalDocument[]>(LEGAL_DOCUMENTS_QUERY, {}, { perspective }),
     ]);
 
   const hasNavData = hasValidData(initialNav.data);
-  const hasSiteSettingsData = hasValidData(initialSiteSettings.data);
+  const hasCompanyInfoData = hasValidData(initialCompanyInfo.data);
 
   const hasHeaderData =
     hasNavData && (initialNav.data.main || initialNav.data.sidebar);
 
   const hasFooterData = hasNavData && initialNav.data.footer;
-  const hasMenuData = hasSiteSettingsData && (hasHeaderData || hasFooterData);
+  const hasMenuData = hasCompanyInfoData && (hasHeaderData || hasFooterData);
 
   if (!hasMenuData) {
     return (
@@ -55,12 +55,12 @@ export default async function Layout({
       {hasHeaderData && isDraftMode ? (
         <HeaderPreview
           initialNav={initialNav}
-          initialSiteSetting={initialSiteSettings}
+          initialCompanyInfo={initialCompanyInfo}
         />
       ) : (
         <Header
           data={initialNav.data}
-          assets={initialSiteSettings.data?.brandAssets}
+          assets={initialCompanyInfo.data?.brandAssets}
         />
       )}
       <main id="main" tabIndex={-1}>
@@ -69,14 +69,14 @@ export default async function Layout({
       {hasFooterData && isDraftMode ? (
         <FooterPreview
           initialNav={initialNav}
-          initialSiteSetting={initialSiteSettings}
+          initialCompanyInfo={initialCompanyInfo}
           initialSoMe={initialSoMe}
         />
       ) : (
         <Footer
           navigationData={initialNav.data}
           legalData={initialLegal.data}
-          siteSettings={initialSiteSettings.data}
+          companyInfo={initialCompanyInfo.data}
           soMeData={initialSoMe.data}
         />
       )}

src/app/layout.tsx

@@ -1,8 +1,8 @@
 import { Darker_Grotesque, Figtree } from "next/font/google";
 import { draftMode } from "next/headers";
 import LiveVisualEditing from "studio/lib/loaders/AutomaticVisualEditing";
-import { SiteSettings } from "studio/lib/payloads/siteSettings";
-import { SITESETTINGS_QUERY } from "studio/lib/queries/siteSettings";
+import { CompanyInfo } from "studio/lib/payloads/companyInfo";
+import { COMPANY_INFO_QUERY } from "studio/lib/queries/companyInfo";
 import { Metadata } from "next";
 import { loadQuery } from "studio/lib/store";
 import "src/styles/global.css";
@@ -31,7 +31,7 @@ export default async function RootLayout({
   let siteLang;
 
   try {
-    const { data } = await loadQuery<SiteSettings>(SITESETTINGS_QUERY);
+    const { data } = await loadQuery<CompanyInfo>(COMPANY_INFO_QUERY);
     siteLang = data.siteMetadata?.defaultLanguage;
   } catch (error) {
     console.error("Error loading site settings:", error);

src/components/navigation/footer/Footer.stories.tsx

@@ -3,7 +3,7 @@ import Footer from "./Footer";
 import {
   mockNavigation,
   mockSocialMediaProfiles,
-  mockSiteSettings,
+  mockCompanyInfo,
 } from "../mockData";
 
 const meta: Meta<typeof Footer> = {
@@ -25,7 +25,7 @@ type Story = StoryObj<typeof Footer>;
 export const Default: Story = {
   args: {
     navigationData: mockNavigation,
-    siteSettings: mockSiteSettings,
+    companyInfo: mockCompanyInfo,
     soMeData: mockSocialMediaProfiles,
   },
 };

src/components/navigation/footer/Footer.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { ILink, LinkType, Navigation } from "studio/lib/payloads/navigation";
-import { SiteSettings } from "studio/lib/payloads/siteSettings";
+import { CompanyInfo } from "studio/lib/payloads/companyInfo";
 import { useConvertSanityImageToNextImage } from "src/utils/hooks/useConvertImage";
 import styles from "./footer.module.css";
 import CustomLink from "../../link/CustomLink";
@@ -16,19 +16,19 @@ import { LegalDocument } from "studio/lib/payloads/legalDocuments";
 
 export interface IFooter {
   navigationData: Navigation;
-  siteSettings: SiteSettings;
+  companyInfo: CompanyInfo;
   soMeData: SocialMediaProfiles;
   legalData: LegalDocument[];
 }
 
 const Footer = ({
   navigationData,
-  siteSettings,
+  companyInfo,
   soMeData,
   legalData,
 }: IFooter) => {
   const renderedLogo = useConvertSanityImageToNextImage(
-    siteSettings.brandAssets?.secondaryLogo,
+    companyInfo.brandAssets?.secondaryLogo,
   );
 
   const currentYear = new Date().getFullYear();
@@ -43,7 +43,7 @@ const Footer = ({
       <ul className={styles.credits}>
         <li key="credit-legal-key-1">
           <Text className={styles.whiteColor}>
-            {`© ${currentYear} ${siteSettings.siteMetadata?.siteName}`}
+            {`© ${currentYear} ${companyInfo.siteMetadata?.siteName}`}
           </Text>
         </li>
         {legalData?.map((legal) => {

src/components/navigation/footer/FooterPreview.tsx

@@ -2,8 +2,8 @@
 import { QueryResponseInitial, useQuery } from "@sanity/react-loader";
 import { NAV_QUERY } from "studio/lib/queries/navigation";
 import { Navigation } from "studio/lib/payloads/navigation";
-import { SiteSettings } from "studio/lib/payloads/siteSettings";
-import { SITESETTINGS_QUERY } from "studio/lib/queries/siteSettings";
+import { CompanyInfo } from "studio/lib/payloads/companyInfo";
+import { COMPANY_INFO_QUERY } from "studio/lib/queries/companyInfo";
 import Footer from "./Footer";
 import { SocialMediaProfiles } from "studio/lib/payloads/socialMedia";
 import { SOMEPROFILES_QUERY } from "studio/lib/queries/socialMediaProfiles";
@@ -18,27 +18,24 @@ function useInitialData<T>(
 
 export default function FooterPreview({
   initialNav,
-  initialSiteSetting,
+  initialCompanyInfo,
   initialSoMe,
 }: {
   initialNav: QueryResponseInitial<Navigation>;
-  initialSiteSetting: QueryResponseInitial<SiteSettings>;
+  initialCompanyInfo: QueryResponseInitial<CompanyInfo>;
   initialSoMe: QueryResponseInitial<SocialMediaProfiles>;
 }) {
   const newNav = useInitialData(NAV_QUERY, initialNav);
-  const newSiteSettings = useInitialData(
-    SITESETTINGS_QUERY,
-    initialSiteSetting,
-  );
+  const newCompanyInfo = useInitialData(COMPANY_INFO_QUERY, initialCompanyInfo);
   const newSoMedata = useInitialData(SOMEPROFILES_QUERY, initialSoMe);
   // TODO: add legal preview
   return (
     newNav &&
-    newSiteSettings &&
+    newCompanyInfo &&
     newSoMedata && (
       <Footer
         navigationData={newNav}
-        siteSettings={newSiteSettings}
+        companyInfo={newCompanyInfo}
         soMeData={newSoMedata}
         legalData={[]}
       />

src/components/navigation/header/Header.tsx

@@ -9,7 +9,7 @@ import { linkID } from "studio/schemas/objects/link";
 import { callToActionFieldID } from "studio/schemas/fields/callToActionFields";
 import CustomLink from "src/components/link/CustomLink";
 import LinkButton from "src/components/linkButton/LinkButton";
-import { BrandAssets } from "studio/lib/payloads/siteSettings";
+import { BrandAssets } from "studio/lib/payloads/companyInfo";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { getHref } from "src/utils/get";

src/components/navigation/header/HeaderPreview.tsx

@@ -3,31 +3,31 @@ import { QueryResponseInitial, useQuery } from "@sanity/react-loader";
 import { NAV_QUERY } from "studio/lib/queries/navigation";
 import { Navigation } from "studio/lib/payloads/navigation";
 import { Header } from "./Header";
-import { SiteSettings } from "studio/lib/payloads/siteSettings";
-import { SITESETTINGS_QUERY } from "studio/lib/queries/siteSettings";
+import { CompanyInfo } from "studio/lib/payloads/companyInfo";
+import { COMPANY_INFO_QUERY } from "studio/lib/queries/companyInfo";
 
 export default function HeaderPreview({
   initialNav,
-  initialSiteSetting,
+  initialCompanyInfo,
 }: {
   initialNav: QueryResponseInitial<Navigation>;
-  initialSiteSetting: QueryResponseInitial<SiteSettings>;
+  initialCompanyInfo: QueryResponseInitial<CompanyInfo>;
 }) {
   const { data: newNav } = useQuery<Navigation | null>(
     NAV_QUERY,
     {},
     { initial: initialNav },
   );
-  const { data: newSiteSettings } = useQuery<SiteSettings | null>(
-    SITESETTINGS_QUERY,
+  const { data: newCompanyInfo } = useQuery<CompanyInfo | null>(
+    COMPANY_INFO_QUERY,
     {},
-    { initial: initialSiteSetting },
+    { initial: initialCompanyInfo },
   );
 
   return (
     newNav &&
-    newSiteSettings && (
-      <Header data={newNav} assets={newSiteSettings.brandAssets} />
+    newCompanyInfo && (
+      <Header data={newNav} assets={newCompanyInfo.brandAssets} />
     )
   );
 }

src/components/navigation/mockData.ts

@@ -7,7 +7,7 @@ import { callToActionFieldID } from "studio/schemas/fields/callToActionFields";
 import { linkID } from "studio/schemas/objects/link";
 import primaryLogoFile from "../../stories/assets/energiai-primary-logo.svg";
 import secondaryLogoFile from "../../stories/assets/energiai-secondary-logo.svg";
-import { BrandAssets } from "studio/lib/payloads/siteSettings";
+import { BrandAssets } from "studio/lib/payloads/companyInfo";
 import { SocialMediaProfiles } from "studio/lib/payloads/socialMedia";
 
 // Mock Navigation Data
@@ -110,7 +110,7 @@ export const mockNavigation: Navigation = {
   ],
 };
 
-export const mockSiteSettings = {
+export const mockCompanyInfo = {
   siteMetadata: {
     siteName: "Varaint",
     defaultLanguage: "en",

src/utils/seo.ts

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 import { toPlainText } from "@portabletext/toolkit";
 import { urlFor } from "studio/lib/image";
-import { SITESETTINGS_QUERY } from "studio/lib/queries/siteSettings";
+import { COMPANY_INFO_QUERY } from "studio/lib/queries/companyInfo";
 import { loadQuery } from "studio/lib/store";
 import { PortableTextBlock } from "src/components/richText/RichText";
 
@@ -19,7 +19,7 @@ type PostSeoData = {
   keywords: string;
 };
 
-type SiteSettings = {
+type CompanyInfo = {
   siteMetadata: {
     siteName: string;
   };
@@ -65,9 +65,9 @@ export async function fetchPostSeoData(
   }
 }
 
-export async function fetchSiteSettings(): Promise<SiteSettings | null> {
+export async function fetchCompanyInfo(): Promise<CompanyInfo | null> {
   try {
-    const { data } = await loadQuery<SiteSettings>(SITESETTINGS_QUERY);
+    const { data } = await loadQuery<CompanyInfo>(COMPANY_INFO_QUERY);
     return data;
   } catch (error) {
     console.error("Error loading site settings:", error);
@@ -78,15 +78,15 @@ export async function fetchSiteSettings(): Promise<SiteSettings | null> {
 export async function generateMetadataFromSeo(
   seo: SeoData | null,
 ): Promise<Metadata> {
-  const siteSettings = await fetchSiteSettings();
+  const companyInfo = await fetchCompanyInfo();
 
   const title =
-    seo?.title || siteSettings?.siteMetadata?.siteName || "Fallback Title";
+    seo?.title || companyInfo?.siteMetadata?.siteName || "Fallback Title";
   const description = seo?.description || "";
   const imageUrl = seo?.imageUrl || "";
   const keywords = seo?.keywords || "";
 
-  const favicon = siteSettings?.brandAssets?.favicon;
+  const favicon = companyInfo?.brandAssets?.favicon;
   const faviconUrl = favicon ? urlFor(favicon).url() : "";
 
   const icons = [faviconUrl ? { rel: "icon", url: faviconUrl } : null].filter(

studio/lib/payloads/siteSettings.ts → studio/lib/payloads/companyInfo.ts

@@ -1,6 +1,6 @@
 import { IImage } from "./media";
 
-export interface SiteSettings {
+export interface CompanyInfo {
   brandAssets: BrandAssets;
   siteMetadata: SiteMetadata;
 }

studio/lib/queries/siteSettings.ts → studio/lib/queries/companyInfo.ts

@@ -1,6 +1,6 @@
 import { groq } from "next-sanity";
 
-export const SITESETTINGS_QUERY = groq`*[_type == "siteSettings"]{
+export const COMPANY_INFO_QUERY = groq`*[_type == "companyInfo"]{
     brandAssets,
     siteMetadata,
     legalPages,

studio/schema.ts

@@ -6,7 +6,7 @@ import { socialMedia } from "./schemas/objects/socialMedia";
 import { footerSection } from "./schemas/objects/footerSection";
 import socialMediaLinks from "./schemas/documents/socialMediaProfiles";
 import callToActionField from "./schemas/fields/callToActionFields";
-import siteSettings from "./schemas/documents/siteSettings";
+import companyInfo from "./schemas/documents/companyInfo";
 import blog from "./schemas/documents/blog";
 import posts from "./schemas/documents/post";
 import categories from "./schemas/fields/categories";
@@ -16,7 +16,7 @@ import salaryAndBenefits from "./schemas/documents/salaryAndBenefits";
 
 export const schema: { types: SchemaTypeDefinition[] } = {
   types: [
-    siteSettings,
+    companyInfo,
     navigationManager,
     socialMediaLinks,
     pageBuilder,