mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-03-04 02:01:58 -05:00
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
This commit is contained in:
parent
17e9b803e4
commit
75b4b1fdff
4 changed files with 29 additions and 18 deletions
|
@ -1,11 +1,12 @@
|
||||||
import React, {createContext, useCallback, useContext, useEffect, useState} from 'react';
|
import React, {createContext, useCallback, useContext, useEffect, useState} from 'react';
|
||||||
import {ServicesContext} from './ServiceProvider';
|
import {ServicesContext} from './ServiceProvider';
|
||||||
import {Setting} from '../../types/api';
|
import {Setting, SiteData} from '../../types/api';
|
||||||
|
|
||||||
// Define the Settings Context
|
// Define the Settings Context
|
||||||
interface SettingsContextProps {
|
interface SettingsContextProps {
|
||||||
settings: Setting[] | null;
|
settings: Setting[] | null;
|
||||||
saveSettings: (updatedSettings: Setting[]) => Promise<void>;
|
saveSettings: (updatedSettings: Setting[]) => Promise<void>;
|
||||||
|
siteData: SiteData | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface SettingsProviderProps {
|
interface SettingsProviderProps {
|
||||||
|
@ -14,20 +15,24 @@ interface SettingsProviderProps {
|
||||||
|
|
||||||
const SettingsContext = createContext<SettingsContextProps>({
|
const SettingsContext = createContext<SettingsContextProps>({
|
||||||
settings: null,
|
settings: null,
|
||||||
saveSettings: async () => {}
|
siteData: null,
|
||||||
|
saveSettings: async () => {},
|
||||||
});
|
});
|
||||||
|
|
||||||
// Create a Settings Provider component
|
// Create a Settings Provider component
|
||||||
const SettingsProvider: React.FC<SettingsProviderProps> = ({children}) => {
|
const SettingsProvider: React.FC<SettingsProviderProps> = ({children}) => {
|
||||||
const {api} = useContext(ServicesContext);
|
const {api} = useContext(ServicesContext);
|
||||||
const [settings, setSettings] = useState <Setting[] | null> (null);
|
const [settings, setSettings] = useState <Setting[] | null> (null);
|
||||||
|
const [siteData, setSiteData] = useState <SiteData | null> (null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const fetchSettings = async (): Promise<void> => {
|
const fetchSettings = async (): Promise<void> => {
|
||||||
try {
|
try {
|
||||||
// Make an API call to fetch the settings
|
// Make an API call to fetch the settings
|
||||||
const data = await api.settings.browse();
|
const data = await api.settings.browse();
|
||||||
|
const siteDataRes = await api.site.browse();
|
||||||
setSettings(data.settings);
|
setSettings(data.settings);
|
||||||
|
setSiteData(siteDataRes.site);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
// Log error in settings API
|
// 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
|
// Provide the settings and the saveSettings function to the children components
|
||||||
return (
|
return (
|
||||||
<SettingsContext.Provider value={{settings, saveSettings}}>
|
<SettingsContext.Provider value={{
|
||||||
|
settings, saveSettings, siteData
|
||||||
|
}}>
|
||||||
{children}
|
{children}
|
||||||
</SettingsContext.Provider>
|
</SettingsContext.Provider>
|
||||||
);
|
);
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React, {useEffect} from 'react';
|
import React, {useEffect} from 'react';
|
||||||
import {SaveState, TSettingGroupStates} from '../admin-x-ds/settings/SettingGroup';
|
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 {SettingsContext} from '../components/providers/SettingsProvider';
|
||||||
import {useContext, useReducer, useRef, useState} from 'react';
|
import {useContext, useReducer, useRef, useState} from 'react';
|
||||||
|
|
||||||
|
@ -11,6 +11,7 @@ interface LocalSetting extends Setting {
|
||||||
export interface SettingGroupHook {
|
export interface SettingGroupHook {
|
||||||
currentState: TSettingGroupStates;
|
currentState: TSettingGroupStates;
|
||||||
saveState: SaveState;
|
saveState: SaveState;
|
||||||
|
siteData: SiteData | null;
|
||||||
focusRef: React.RefObject<HTMLInputElement>;
|
focusRef: React.RefObject<HTMLInputElement>;
|
||||||
handleSave: () => void;
|
handleSave: () => void;
|
||||||
handleCancel: () => void;
|
handleCancel: () => void;
|
||||||
|
@ -59,7 +60,7 @@ const useSettingGroup = (): SettingGroupHook => {
|
||||||
const focusRef = useRef<HTMLInputElement>(null);
|
const focusRef = useRef<HTMLInputElement>(null);
|
||||||
|
|
||||||
// get the settings and saveSettings function from the Settings Context
|
// 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
|
// create a local state to store the settings
|
||||||
const [localSettings, dispatch] = useReducer<SettingsReducer>(settingsReducer, settings || []);
|
const [localSettings, dispatch] = useReducer<SettingsReducer>(settingsReducer, settings || []);
|
||||||
|
@ -140,6 +141,7 @@ const useSettingGroup = (): SettingGroupHook => {
|
||||||
currentState,
|
currentState,
|
||||||
saveState,
|
saveState,
|
||||||
focusRef,
|
focusRef,
|
||||||
|
siteData,
|
||||||
handleSave,
|
handleSave,
|
||||||
handleCancel,
|
handleCancel,
|
||||||
updateSetting,
|
updateSetting,
|
||||||
|
|
|
@ -44,3 +44,14 @@ export type UserRole = {
|
||||||
created_at: string;
|
created_at: string;
|
||||||
updated_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;
|
||||||
|
};
|
|
@ -1,4 +1,4 @@
|
||||||
import {Setting, User, UserRole} from '../types/api';
|
import {Setting, SiteData, User, UserRole} from '../types/api';
|
||||||
import {getGhostPaths} from './helpers';
|
import {getGhostPaths} from './helpers';
|
||||||
|
|
||||||
interface Meta {
|
interface Meta {
|
||||||
|
@ -28,16 +28,7 @@ export interface RolesResponseType {
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface SiteResponseType {
|
export interface SiteResponseType {
|
||||||
site: {
|
site: SiteData;
|
||||||
title: string;
|
|
||||||
description: string;
|
|
||||||
logo: string;
|
|
||||||
icon: string;
|
|
||||||
accent_color: string;
|
|
||||||
url: string;
|
|
||||||
locale: string;
|
|
||||||
version: string;
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ImagesResponseType {
|
export interface ImagesResponseType {
|
||||||
|
|
Loading…
Add table
Reference in a new issue