LogalDeveloper/owncast
0
Fork 0
Code Activity

Add support for changing user color in name modal. Closes #1805

Browse Source
This commit is contained in:
Gabe Kangas
2022-08-09 19:56:45 -07:00
parent 9187a7a435
commit 68414445c2
22 changed files with 171 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
web/components/stores/ClientConfigStore.tsx
View File

@@ -46,6 +46,11 @@ export const chatDisplayNameAtom = atom<string>({
default: null,
});
export const chatDisplayColorAtom = atom<number>({
key: 'chatDisplayColor',
default: null,
});
export const chatUserIdAtom = atom<string>({
key: 'chatUserIdAtom',
default: null,
@@ -149,6 +154,7 @@ export function ClientConfigStore() {
const [appState, appStateSend, appStateService] = useMachine(appStateModel);
const setChatDisplayName = useSetRecoilState<string>(chatDisplayNameAtom);
const setChatDisplayColor = useSetRecoilState<Number>(chatDisplayColorAtom);
const setChatUserId = useSetRecoilState<string>(chatUserIdAtom);
const setIsChatModerator = useSetRecoilState<boolean>(isChatModeratorAtom);
const setClientConfig = useSetRecoilState<ClientConfig>(clientConfigStateAtom);
@@ -225,7 +231,7 @@ export function ClientConfigStore() {
sendEvent(AppStateEvent.NeedsRegister);
const response = await ChatService.registerUser(optionalDisplayName);
console.log(`ChatService -> registerUser() response: \n${response}`);
const { accessToken: newAccessToken, displayName: newDisplayName } = response;
const { accessToken: newAccessToken, displayName: newDisplayName, displayColor } = response;
if (!newAccessToken) {
return;
}
@@ -234,6 +240,7 @@ export function ClientConfigStore() {
setAccessToken(newAccessToken);
setLocalStorage(ACCESS_TOKEN_KEY, newAccessToken);
setChatDisplayName(newDisplayName);
setChatDisplayColor(displayColor);
} catch (e) {
sendEvent(AppStateEvent.Fail);
console.error(`ChatService -> registerUser() ERROR: \n${e}`);
@@ -255,6 +262,7 @@ export function ClientConfigStore() {
handleConnectedClientInfoMessage(
message as ConnectedClientInfoEvent,
setChatDisplayName,
setChatDisplayColor,
setChatUserId,
setIsChatModerator,
);

4
web/components/stores/eventhandlers/connected-client-info-handler.ts
View File

@@ -3,12 +3,14 @@ import { ConnectedClientInfoEvent } from '../../../interfaces/socket-events';
export default function handleConnectedClientInfoMessage(
message: ConnectedClientInfoEvent,
setChatDisplayName: (string) => void,
setChatDisplayColor: (number) => void,
setChatUserId: (number) => void,
setIsChatModerator: (boolean) => void,
) {
const { user } = message;
const { id, displayName, scopes } = user;
const { id, displayName, displayColor, scopes } = user;
setChatDisplayName(displayName);
setChatDisplayColor(displayColor);
setChatUserId(id);
setIsChatModerator(scopes?.includes('moderator'));
}