LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-22 12:21:13 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'main' into darkly-tweak

Browse source
This commit is contained in:
SleeplessOne1917 2023-07-04 21:19:30 +00:00 committed by GitHub
commit 2e621c2d57
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 70 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/client/index.tsx
View file

@ -2,7 +2,7 @@ import { initializeSite, setupDateFns } from "@utils/app";
import { hydrate } from "inferno-hydrate";
import { Router } from "inferno-router";
import { App } from "../shared/components/app/app";
import { HistoryService } from "../shared/services";
import { HistoryService, UserService } from "../shared/services";
import "bootstrap/js/dist/collapse";
import "bootstrap/js/dist/dropdown";
@ -14,7 +14,7 @@ async function startClient() {
const wrapper = (
<Router history={HistoryService.history}>
<App />
<App user={UserService.Instance.myUserInfo} />
</Router>
);

2
src/server/handlers/catch-all-handler.tsx
View file

@ -114,7 +114,7 @@ export default async (req: Request, res: Response) => {
const wrapper = (
<StaticRouter location={url} context={isoData}>
<App />
<App user={site?.my_user} />
</StaticRouter>
);

15
src/shared/components/app/app.tsx
View file

@ -3,6 +3,7 @@ import { dataBsTheme } from "@utils/browser";
import { Component, RefObject, createRef, linkEvent } from "inferno";
import { Provider } from "inferno-i18next-dess";
import { Route, Switch } from "inferno-router";
import { MyUserInfo } from "lemmy-js-client";
import { IsoDataOptionalSite } from "../../interfaces";
import { routes } from "../../routes";
import { FirstLoadService, I18NextService, UserService } from "../../services";
@ -14,10 +15,14 @@ import { Navbar } from "./navbar";
import "./styles.scss";
import { Theme } from "./theme";
export class App extends Component<any, any> {
interface AppProps {
user?: MyUserInfo;
}
export class App extends Component<AppProps, any> {
private isoData: IsoDataOptionalSite = setIsoData(this.context);
private readonly mainContentRef: RefObject<HTMLElement>;
constructor(props: any, context: any) {
constructor(props: AppProps, context: any) {
super(props, context);
this.mainContentRef = createRef();
}
@ -29,10 +34,6 @@ export class App extends Component<any, any> {
user = UserService.Instance.myUserInfo;
componentDidMount() {
this.setState({ bsTheme: dataBsTheme(this.user) });
}
render() {
const siteRes = this.isoData.site_res;
const siteView = siteRes?.site_view;
@ -43,7 +44,7 @@ export class App extends Component<any, any> {
<div
id="app"
className="lemmy-site"
data-bs-theme={this.state?.bsTheme}
data-bs-theme={dataBsTheme(this.props.user)}
>
<button
type="button"

10
src/shared/components/common/user-badges.tsx
View file

@ -53,7 +53,7 @@ export class UserBadges extends Component<UserBadgesProps> {
{getRoleLabelPill({
label: I18NextService.i18n.t("banned"),
tooltip: I18NextService.i18n.t("banned"),
classes: "text-bg-danger",
classes: "text-danger border border-danger",
shrink: false,
})}
</span>
@ -63,7 +63,7 @@ export class UserBadges extends Component<UserBadgesProps> {
{getRoleLabelPill({
label: I18NextService.i18n.t("deleted"),
tooltip: I18NextService.i18n.t("deleted"),
classes: "text-bg-danger",
classes: "text-danger border border-danger",
shrink: false,
})}
</span>
@ -74,7 +74,7 @@ export class UserBadges extends Component<UserBadgesProps> {
{getRoleLabelPill({
label: I18NextService.i18n.t("op").toUpperCase(),
tooltip: I18NextService.i18n.t("creator"),
classes: "text-bg-info",
classes: "text-info border border-info",
shrink: false,
})}
</span>
@ -84,7 +84,7 @@ export class UserBadges extends Component<UserBadgesProps> {
{getRoleLabelPill({
label: I18NextService.i18n.t("mod"),
tooltip: I18NextService.i18n.t("mod"),
classes: "text-bg-primary",
classes: "text-primary border border-primary",
})}
</span>
)}
@ -93,7 +93,7 @@ export class UserBadges extends Component<UserBadgesProps> {
{getRoleLabelPill({
label: I18NextService.i18n.t("admin"),
tooltip: I18NextService.i18n.t("admin"),
classes: "text-bg-danger",
classes: "text-danger border border-danger",
})}
</span>
)}

25
src/shared/components/home/home.tsx
View file

@ -114,7 +114,7 @@ interface HomeState {
}
interface HomeProps {
listingType: ListingType;
listingType?: ListingType;
dataType: DataType;
sort: SortType;
page: number;
@ -163,12 +163,12 @@ function getDataTypeFromQuery(type?: string): DataType {
return type ? DataType[type] : DataType.Post;
}
function getListingTypeFromQuery(type?: string): ListingType {
function getListingTypeFromQuery(type?: string): ListingType | undefined {
const myListingType =
UserService.Instance.myUserInfo?.local_user_view?.local_user
?.default_listing_type;
return (type ? (type as ListingType) : myListingType) ?? "Local";
return type ? (type as ListingType) : myListingType;
}
function getSortTypeFromQuery(type?: string): SortType {
@ -311,11 +311,12 @@ export class Home extends Component<any, HomeState> {
client,
auth,
query: { dataType: urlDataType, listingType, page: urlPage, sort: urlSort },
site,
}: InitialFetchRequest<QueryParams<HomeProps>>): Promise<HomeData> {
const dataType = getDataTypeFromQuery(urlDataType);
// TODO figure out auth default_listingType, default_sort_type
const type_ = getListingTypeFromQuery(listingType);
const type_ =
getListingTypeFromQuery(listingType) ??
site.site_view.local_site.default_post_listing_type;
const sort = getSortTypeFromQuery(urlSort);
const page = urlPage ? Number(urlPage) : 1;
@ -761,7 +762,10 @@ export class Home extends Component<any, HomeState> {
</div>
<div className="col-auto">
<ListingTypeSelect
type_={listingType}
type_={
listingType ??
this.state.siteRes.site_view.local_site.default_post_listing_type
}
showLocal={showLocal(this.isoData)}
showSubscribed
onChange={this.handleListingTypeChange}
@ -770,7 +774,12 @@ export class Home extends Component<any, HomeState> {
<div className="col-auto">
<SortSelect sort={sort} onChange={this.handleSortChange} />
</div>
<div className="col-auto ps-0">{getRss(listingType)}</div>
<div className="col-auto ps-0">
{getRss(
listingType ??
this.state.siteRes.site_view.local_site.default_post_listing_type
)}
</div>
</div>
);
}

4
src/shared/components/home/login.tsx
View file

@ -175,7 +175,9 @@ export class Login extends Component<any, State> {
}
case "success": {
UserService.Instance.login(loginRes.data);
UserService.Instance.login({
res: loginRes.data,
});
const site = await HttpService.client.getSite({
auth: myAuth(),
});

2
src/shared/components/home/setup.tsx
View file

@ -206,7 +206,7 @@ export class Setup extends Component<any, State> {
if (i.state.registerRes.state == "success") {
const data = i.state.registerRes.data;
UserService.Instance.login(data);
UserService.Instance.login({ res: data });
i.setState({ doneRegisteringUser: true });
}
}

4
src/shared/components/home/signup.tsx
View file

@ -469,7 +469,9 @@ export class Signup extends Component<any, State> {
// Only log them in if a jwt was set
if (data.jwt) {
UserService.Instance.login(data);
UserService.Instance.login({
res: data,
});
const site = await HttpService.client.getSite({ auth: myAuth() });

4
src/shared/components/person/password-change.tsx
View file

@ -135,7 +135,9 @@ export class PasswordChange extends Component<any, State> {
if (i.state.passwordChangeRes.state === "success") {
const data = i.state.passwordChangeRes.data;
UserService.Instance.login(data);
UserService.Instance.login({
res: data,
});
const site = await HttpService.client.getSite({ auth: myAuth() });
if (site.state === "success") {

11
src/shared/components/person/settings.tsx
View file

@ -1175,8 +1175,12 @@ export class Settings extends Component<any, SettingsState> {
...i.state.saveUserSettingsForm,
auth: myAuthRequired(),
});
if (saveRes.state === "success") {
UserService.Instance.login(saveRes.data);
UserService.Instance.login({
res: saveRes.data,
showToast: false,
});
toast(I18NextService.i18n.t("saved"));
window.scrollTo(0, 0);
}
@ -1198,7 +1202,10 @@ export class Settings extends Component<any, SettingsState> {
auth: myAuthRequired(),
});
if (changePasswordRes.state === "success") {
UserService.Instance.login(changePasswordRes.data);
UserService.Instance.login({
res: changePasswordRes.data,
showToast: false,
});
window.scrollTo(0, 0);
toast(I18NextService.i18n.t("password_changed"));
}

10
src/shared/services/UserService.ts
View file

@ -26,12 +26,18 @@ export class UserService {
this.#setJwtInfo();
}
public login(res: LoginResponse) {
public login({
res,
showToast = true,
}: {
res: LoginResponse;
showToast?: boolean;
}) {
const expires = new Date();
expires.setDate(expires.getDate() + 365);
if (isBrowser() && res.jwt) {
toast(I18NextService.i18n.t("logged_in"));
showToast && toast(I18NextService.i18n.t("logged_in"));
setAuthCookie(res.jwt);
this.#setJwtInfo();
}

14
src/shared/utils/browser/data-bs-theme.ts
View file

@ -1,11 +1,17 @@
import { MyUserInfo } from "lemmy-js-client";
import isDark from "./is-dark";
export default function dataBsTheme(user) {
export default function dataBsTheme(user?: MyUserInfo) {
return (isDark() && user?.local_user_view.local_user.theme === "browser") ||
(user &&
["darkly", "darkly-red", "darkly-pureblack"].includes(
user.local_user_view.local_user.theme
))
[
"darkly",
"darkly-red",
"darkly-pureblack",
"darkly-compact",
"i386",
"vaporwave-dark",
].includes(user.local_user_view.local_user.theme))
? "dark"
: "light";
}