v0.0.5-RC2
RC2
Frontend rework
Our frontend app now uses createContext for globally page setting which will make it easier later on to be able to set pages ('components') from inside other components.
Example of using page setter/getter
import { FC, useCallback } from "react";
import { usePage } from "./PageContext";
export const MyComponent: FC = () => {
const {page, setPage} = usePage();
const handleClick = useCallback(() => {
//check whether the page is or not 'auth' and if its not then set it!
if (page !== "auth") setPage("auth")
}, [])
return <button onClick={() => handleClick()}>CLICK ME</button>
}
We are now using shared data in frontend also! Shared data is quite useful when you want to keep track of what you're doing, like what kind of data you're using, instead of having them declared in both parts, shared and frontend we are now declaring them only in the shared folder. Eventually every interface that's being exported from the modules and used more than once will be moved to shared folder.
Events
Instead of creating 'new files' to store events added with EventManager we're now creating events inside store class.
This change requires you that everytime you create a new store you make sure 'createEvents' method is there as a public method.
Before:
import { useEffect } from "react";
import MyStore from "stores/MyStore";
import EventManager from "utils/EventManager.util";
export const InitMyStoreEvents = (store: MyStore) => {
return useEffect(() => {
EventManager.addHandler("pagename", "setdata", (data: number) => store.setData(data));
EventManager.stopAddingHandler("pagename");
return () => EventManager.removeTargetHandlers("pagename");
}, [store]);
};
After:
import { makeObservable, observable, action } from "mobx";
import EventManager from "utils/EventManager.util";
class MyStore {
@observable
mydata: number = 0;
constructor(){
makeObservable(this);
}
@action.bound
setData(data: number) {
this.mydata = data;
}
public createEvents() {
EventManager.addHandler("pagename", "setdata", (data: number) => this.setData(data));
EventManager.stopAddingHandler("pagename");
}
}
Make sure the newly created store is included in the main App.tsx
inside the primary used useEffect
const myStore = useLocalObservable(() => new MyStore());
const myOtherCoolStore = useLocalObservable(() => new MyOtherCoolStore());
useEffect(() => {
const stores = [
{ store: myStore, event: "myStore" },
{ store: myOtherCoolStore, event: "myOtherCoolStore" },
];
stores.forEach(({ store, event }) => {
//this will call our created createEvents method to initialize events that can be called form backend
store.createEvents();
return () => EventManager.removeTargetHandlers(event);
});
}, [myStore, myOtherCoolStore])
Shared data changes
Shared data now exports namespaces, interfaces and enums instead of declaring them. This mainly was done because we're now using shared data in frontend like interfaces and enums and using declared enum is not possible since frontend wouldn't know what that enum really is when building, but importing them let's the frontend know what their values are.
Other Fixes
[/] Fixed errors when creating a second or third character due to database relations being described wrongly.
[/] Fixed an issue with things not working correctly after creating a character for the first time (like inventory or hud wasn't updating)
[/] Fixed chat input image tripping when a suggested command was displayed.
[/] Fixed item swapping causing issues with items equipped in quick use.
What's Changed
- chore: update scripts cef paths by @exodie in #11
- 0.0.5 by @shr0x in #12
- Account relation fixes & first time spawn fixes by @shr0x in #13
Full Changelog: v0.0.5-RC1...v0.0.5-RC2