import { create } from 'zustand';
import { StatusBarStyle } from 'expo-status-bar';
import { colors } from './theme-colors';

interface StatusBarState {
  barStyle: StatusBarStyle;
  backgroundColor: string;
  updateStatusBarColor: (barStyle: StatusBarStyle, backgroundColor: string) => void;
}

export const useStatusBarStore = create<StatusBarState>((set) => ({
  barStyle: 'light',
  // backgroundColor: '#FFD6D9',
  backgroundColor: colors.secondaryPink,
  updateStatusBarColor: (barStyle, backgroundColor) =>
    set({ barStyle, backgroundColor }),
}));

export const updateStatusBarColor = (barStyle: StatusBarStyle, backgroundColor: string) => {
  useStatusBarStore.getState().updateStatusBarColor(barStyle, backgroundColor);
};