Added site api data to settings context in admin-x

refs https://github.com/TryGhost/Team/issues/3318

- pulls in site data via API in settings provider
- adds site data to be accessible via settings context

ghost/admin-x-settings/src/components/providers/SettingsProvider.tsx

@@ -1,11 +1,12 @@
 import React, {createContext, useCallback, useContext, useEffect, useState} from 'react';
 import {ServicesContext} from './ServiceProvider';
-import {Setting} from '../../types/api';
+import {Setting, SiteData} from '../../types/api';
 
 // Define the Settings Context
 interface SettingsContextProps {
-  settings: Setting[] | null;
-  saveSettings: (updatedSettings: Setting[]) => Promise<void>;
+    settings: Setting[] | null;
+    saveSettings: (updatedSettings: Setting[]) => Promise<void>;
+    siteData: SiteData | null;
 }
 
 interface SettingsProviderProps {
@@ -14,20 +15,24 @@ interface SettingsProviderProps {
 
 const SettingsContext = createContext<SettingsContextProps>({
     settings: null,
-    saveSettings: async () => {}
+    siteData: null,
+    saveSettings: async () => {},
 });
 
 // Create a Settings Provider component
 const SettingsProvider: React.FC<SettingsProviderProps> = ({children}) => {
     const {api} = useContext(ServicesContext);
     const [settings, setSettings] = useState <Setting[] | null> (null);
+    const [siteData, setSiteData] = useState <SiteData | null> (null);
 
     useEffect(() => {
         const fetchSettings = async (): Promise<void> => {
             try {
                 // Make an API call to fetch the settings
                 const data = await api.settings.browse();
+                const siteDataRes = await api.site.browse();
                 setSettings(data.settings);
+                setSiteData(siteDataRes.site);
             } catch (error) {
                 // Log error in settings API
             }
@@ -50,7 +55,9 @@ const SettingsProvider: React.FC<SettingsProviderProps> = ({children}) => {
 
     // Provide the settings and the saveSettings function to the children components
     return (
-        <SettingsContext.Provider value={{settings, saveSettings}}>
+        <SettingsContext.Provider value={{
+            settings, saveSettings, siteData
+        }}>
             {children}
         </SettingsContext.Provider>
     );

ghost/admin-x-settings/src/hooks/useSettingGroup.tsx

@@ -1,6 +1,6 @@
 import React, {useEffect} from 'react';
 import {SaveState, TSettingGroupStates} from '../admin-x-ds/settings/SettingGroup';
-import {Setting, SettingValue} from '../types/api';
+import {Setting, SettingValue, SiteData} from '../types/api';
 import {SettingsContext} from '../components/providers/SettingsProvider';
 import {useContext, useReducer, useRef, useState} from 'react';
 
@@ -11,6 +11,7 @@ interface LocalSetting extends Setting {
 export interface SettingGroupHook {
     currentState: TSettingGroupStates;
     saveState: SaveState;
+    siteData: SiteData | null;
     focusRef: React.RefObject<HTMLInputElement>;
     handleSave: () => void;
     handleCancel: () => void;
@@ -59,7 +60,7 @@ const useSettingGroup = (): SettingGroupHook => {
     const focusRef = useRef<HTMLInputElement>(null);
 
     // get the settings and saveSettings function from the Settings Context
-    const {settings, saveSettings} = useContext(SettingsContext) || {};
+    const {siteData, settings, saveSettings} = useContext(SettingsContext) || {};
 
     // create a local state to store the settings
     const [localSettings, dispatch] = useReducer<SettingsReducer>(settingsReducer, settings || []);
@@ -140,6 +141,7 @@ const useSettingGroup = (): SettingGroupHook => {
         currentState,
         saveState,
         focusRef,
+        siteData,
         handleSave,
         handleCancel,
         updateSetting,

ghost/admin-x-settings/src/types/api.ts

@@ -44,3 +44,14 @@ export type UserRole = {
     created_at: string;
     updated_at: string;
 };
+
+export type SiteData = {
+    title: string;
+    description: string;
+    logo: string;
+    icon: string;
+    accent_color: string;
+    url: string;
+    locale: string;
+    version: string;
+};

ghost/admin-x-settings/src/utils/api.ts

@@ -1,4 +1,4 @@
-import {Setting, User, UserRole} from '../types/api';
+import {Setting, SiteData, User, UserRole} from '../types/api';
 import {getGhostPaths} from './helpers';
 
 interface Meta {
@@ -28,16 +28,7 @@ export interface RolesResponseType {
 }
 
 export interface SiteResponseType {
-    site: {
-        title: string;
-        description: string;
-        logo: string;
-        icon: string;
-        accent_color: string;
-        url: string;
-        locale: string;
-        version: string;
-    };
+    site: SiteData;
 }
 
 export interface ImagesResponseType {