aslan/pulsar-web
SHA256
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rework store

Browse source
This commit is contained in:
Aslan 2026-01-02 00:14:11 +01:00
parent ef526cd2db
commit 8881070cac
9 changed files with 119 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/components/MessageBar/MessageBar.tsx
View file

@ -1,36 +1,13 @@
import type { Component } from "solid-js";
import { dispatch } from "../../store/state";
import { UserActionTypes } from "../../store/user";
import { AuthActionTypes } from "../../store/auth";
const MessageBar: Component = () => {
const onRefresh = () => {
dispatch({
type: AuthActionTypes.FETCH_REFRESH_START,
});
};
const onSend = () => {
dispatch({
type: UserActionTypes.FETCH_LOGGED_USER_ID_START,
});
};
return (
<div class="absolute w-full bottom-0 p-4 z-10">
<div class="bg-stone-800/25 backdrop-blur-lg h-16 shadow-bar p-2 flex flex-row gap-2 rounded-full">
<label class="bg-stone-800/50 backdrop-blur-lg input w-full h-full rounded-full focus:border-none outline-none">
<input type="text" placeholder="Send a message..." />
</label>
<button
class="bg-black/50 backdrop-blur-lg btn btn-neutral h-full rounded-full"
onClick={onRefresh}
>
Refresh test
</button>
<button
class="bg-black/50 backdrop-blur-lg btn btn-neutral h-full rounded-full"
onClick={onSend}
>
<button class="bg-black/50 backdrop-blur-lg btn btn-neutral h-full rounded-full">
Send
</button>
</div>

21
src/store/auth/auth.ts
View file

@ -1,27 +1,22 @@
import { fetchLogin, fetchRefresh } from "../../services/auth";
import { setState } from "../state";
import { AuthActionTypes, AuthAction } from "./actions";
import { IAuthState } from "./types";
function authReducer(state: IAuthState, action: AuthAction): IAuthState {
function authReducer(_state: IAuthState, action: AuthAction) {
switch (action.type) {
case AuthActionTypes.FETCH_LOGIN_START:
fetchLogin(action.payload.username, action.payload.password);
return state;
break;
case AuthActionTypes.FETCH_LOGIN_FINISH:
return {
...state,
session: action.payload,
};
setState("auth", "session", action.payload);
break;
case AuthActionTypes.FETCH_REFRESH_START:
fetchRefresh();
return state;
break;
case AuthActionTypes.FETCH_REFRESH_FINISH:
return {
...state,
session: action.payload,
};
default:
return state;
setState("auth", "session", action.payload);
break;
}
}

34
src/store/community/community.ts
View file

@ -1,33 +1,25 @@
import { fetchCommunity } from "../../services/community";
import { setState } from "../state";
import { CommunityActionTypes, CommunityAction } from "./actions";
import { ICommunityState } from "./types";
function communityReducer(
state: ICommunityState,
action: CommunityAction,
): ICommunityState {
function communityReducer(state: ICommunityState, action: CommunityAction) {
switch (action.type) {
case CommunityActionTypes.FETCH_COMMUNITY_START:
fetchCommunity(action.payload);
return state;
break;
case CommunityActionTypes.FETCH_COMMUNITY_FINISH:
return {
...state,
communities: {
...state.communities,
[action.payload.id]: action.payload,
},
};
setState("community", "communities", {
...state.communities,
[action.payload.id]: action.payload,
});
break;
case CommunityActionTypes.SET_COMMUNITY:
return {
...state,
communities: {
...state.communities,
[action.payload.id]: action.payload,
},
};
default:
return state;
setState("community", "communities", {
...state.communities,
[action.payload.id]: action.payload,
});
break;
}
}

10
src/store/reducers.ts
View file

@ -4,12 +4,10 @@ import { AuthAction, authReducer } from "./auth";
import { UserAction, userReducer } from "./user";
import { CommunityAction, communityReducer } from "./community";
function reducer(state: IState, action: Action): IState {
return {
auth: authReducer(state.auth, action as AuthAction),
user: userReducer(state.user, action as UserAction),
community: communityReducer(state.community, action as CommunityAction),
};
function reducer(state: IState, action: Action) {
authReducer(state.auth, action as AuthAction);
userReducer(state.user, action as UserAction);
communityReducer(state.community, action as CommunityAction);
}
export { reducer };

8
src/store/state.ts
View file

@ -17,11 +17,7 @@ const [state, setState] = createStore<IState>({
});
function dispatch(action: Action) {
setState(reducer(state, action));
reducer(state, action);
}
async function dispatchAsync(action: Action) {
setState(reducer(state, action));
}
export { state, setState, dispatch, dispatchAsync };
export { state, setState, dispatch };

49
src/store/user/user.ts
View file

@ -3,48 +3,41 @@ import {
fetchUser,
fetchUserCommunities,
} from "../../services/user";
import { setState } from "../state";
import { UserActionTypes, UserAction } from "./actions";
import { IUserState } from "./types";
function userReducer(state: IUserState, action: UserAction): IUserState {
function userReducer(state: IUserState, action: UserAction) {
switch (action.type) {
case UserActionTypes.FETCH_LOGGED_USER_ID_START:
fetchLoggedUser();
return state;
break;
case UserActionTypes.FETCH_LOGGED_USER_ID_FINISH:
return {
...state,
loggedUserId: action.payload.id,
};
setState("user", "loggedUserId", action.payload.id);
break;
case UserActionTypes.FETCH_USER_START:
fetchUser(action.payload);
return state;
break;
case UserActionTypes.FETCH_USER_FINISH:
return {
...state,
users: {
...state.users,
[action.payload.id]: action.payload,
},
};
setState("user", "users", {
...state.users,
[action.payload.id]: action.payload,
});
break;
case UserActionTypes.FETCH_USER_COMMUNITIES_START:
fetchUserCommunities(action.payload);
return state;
break;
case UserActionTypes.FETCH_USER_COMMUNITIES_FINISH:
return {
...state,
users: {
...state.users,
[action.payload.id]: {
id: action.payload.id,
communities: action.payload.communities.map(
(community) => community.id,
),
},
setState("user", "users", {
...state.users,
[action.payload.id]: {
id: action.payload.id,
communities: action.payload.communities.map(
(community) => community.id,
),
},
};
default:
return state;
});
break;
}
}

55
src/views/CommunityView/CommunityView.tsx
View file

@ -1,35 +1,48 @@
import type { Component } from "solid-js";
import { createMemo, type Component } from "solid-js";
import { Community } from "../../components/Community";
import { state } from "../../store/state";
const CommunityView: Component = () => {
const communitiesTest = [
{
id: "21",
communityName: "Community 1",
avatar: "https://img.daisyui.com/images/profile/demo/yellingcat@192.webp",
},
{
id: "22",
communityName: "Gamer's Lair",
avatar: "https://img.daisyui.com/images/profile/demo/yellingcat@192.webp",
},
];
const communityIds = createMemo(() => {
const loggedUserId = state.user.loggedUserId;
if (!loggedUserId) {
return [];
}
const loggedUser = state.user.users[loggedUserId];
if (!loggedUser) {
return [];
}
return loggedUser.communities ?? [];
});
const onCommunityClick = (id: string) => {
console.log(id);
};
const mapCommunity = (communityId: string) => {
const community = state.community.communities[communityId];
if (!community) {
return undefined;
}
return (
<Community
id={community.id}
name={community.name ?? ""}
avatar={
"https://img.daisyui.com/images/profile/demo/yellingcat@192.webp"
}
onCommunityClick={onCommunityClick}
/>
);
};
return (
<div class="p-3 h-full">
<div class="bg-stone-950 w-20 h-full rounded-full shadow-panel z-30 flex flex-col p-3 gap-3">
{communitiesTest.map((community) => (
<Community
id={community.id}
name={community.communityName}
avatar={community.avatar}
onCommunityClick={onCommunityClick}
/>
))}
{communityIds().map(mapCommunity)}
</div>
</div>
);

13
src/views/LoginView/LoginView.tsx
View file

@ -1,11 +1,14 @@
import { createSignal, type Component } from "solid-js";
import { dispatch } from "../../store/state";
import { createEffect, createSignal, type Component } from "solid-js";
import { dispatch, state } from "../../store/state";
import { AuthActionTypes } from "../../store/auth";
import { useNavigate } from "@solidjs/router";
const LoginView: Component = () => {
const [getUsername, setUsername] = createSignal("");
const [getPassword, setPassword] = createSignal("");
const navigate = useNavigate();
const onLogin = () => {
dispatch({
type: AuthActionTypes.FETCH_LOGIN_START,
@ -16,6 +19,12 @@ const LoginView: Component = () => {
});
};
createEffect(() => {
if (state.auth.session?.id) {
navigate("/");
}
});
return (
<div>
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 mx-auto mt-32 lg:mt-64">

26
src/views/MainView/MainView.tsx
View file

@ -1,9 +1,33 @@
import type { Component } from "solid-js";
import { createEffect, createMemo, onMount, type Component } from "solid-js";
import { ChannelView } from "../ChannelView";
import { ChatView } from "../ChatView";
import { MemberView } from "../MemberView";
import { dispatch, state } from "../../store/state";
import { UserActionTypes } from "../../store/user";
import { AuthActionTypes } from "../../store/auth";
const MainView: Component = () => {
onMount(() => {
dispatch({
type: AuthActionTypes.FETCH_REFRESH_START,
});
});
createEffect(() => {
if (state.auth.session?.token) {
dispatch({ type: UserActionTypes.FETCH_LOGGED_USER_ID_START });
}
});
createEffect(() => {
if (state.user.loggedUserId) {
dispatch({
type: UserActionTypes.FETCH_USER_COMMUNITIES_START,
payload: state.user.loggedUserId,
});
}
});
return (
<div class="flex flex-row h-screen">
<ChannelView />