fix: tweak UX
This commit is contained in:
Tristan Yang
@@ -16,7 +16,7 @@ const InviteLink: FC<Props> = () => {
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-start pb-8">
|
||||
<p className="font-semibold text-sm mb-2 text-gray-500 dark:text-gray-50 flex gap-4">
|
||||
<p className="font-semibold text-sm mb-2 text-gray-500 dark:text-gray-50 flex flex-col md:flex-row gap-4">
|
||||
{t("share_invite_link")}
|
||||
<a className="text-primary-500 flex gap-1 items-center" href="http://doc.voce.chat/faq#fe_url" target="_blank" rel="noopener noreferrer">
|
||||
<IconQuestion /> {t("invite_link_faq")}
|
||||
|
||||
@@ -84,44 +84,45 @@ const ManageMembers: FC<Props> = ({ cid }) => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-7">
|
||||
<span className="text-xs text-right text-gray-500 dark:text-slate-100 flex items-center gap-1">
|
||||
{is_admin ? t("admin") : t("user")}
|
||||
{switchRoleVisible && (
|
||||
<Tippy
|
||||
interactive
|
||||
placement="bottom-end"
|
||||
trigger="click"
|
||||
content={
|
||||
<ul className="context-menu">
|
||||
<li
|
||||
className="item sb"
|
||||
onClick={handleToggleRole.bind(null, {
|
||||
ignore: is_admin,
|
||||
uid,
|
||||
isAdmin: true
|
||||
})}
|
||||
>
|
||||
{t("admin")}
|
||||
{is_admin && <IconCheck className="icon" />}
|
||||
</li>
|
||||
<li
|
||||
className="item sb"
|
||||
onClick={handleToggleRole.bind(null, {
|
||||
ignore: !is_admin,
|
||||
uid,
|
||||
isAdmin: false
|
||||
})}
|
||||
>
|
||||
{t("user")}
|
||||
{!is_admin && <IconCheck className="icon" />}
|
||||
</li>
|
||||
</ul>
|
||||
}
|
||||
>
|
||||
<IconArrowDown className="cursor-pointer dark:fill-slate-50" />
|
||||
</Tippy>
|
||||
)}
|
||||
</span>
|
||||
{switchRoleVisible ? <Tippy
|
||||
interactive
|
||||
placement="bottom-end"
|
||||
trigger="click"
|
||||
content={
|
||||
<ul className="context-menu">
|
||||
<li
|
||||
className="item sb"
|
||||
onClick={handleToggleRole.bind(null, {
|
||||
ignore: is_admin,
|
||||
uid,
|
||||
isAdmin: true
|
||||
})}
|
||||
>
|
||||
{t("admin")}
|
||||
{is_admin && <IconCheck className="icon" />}
|
||||
</li>
|
||||
<li
|
||||
className="item sb"
|
||||
onClick={handleToggleRole.bind(null, {
|
||||
ignore: !is_admin,
|
||||
uid,
|
||||
isAdmin: false
|
||||
})}
|
||||
>
|
||||
{t("user")}
|
||||
{!is_admin && <IconCheck className="icon" />}
|
||||
</li>
|
||||
</ul>
|
||||
}
|
||||
>
|
||||
<span className="text-xs text-right text-gray-500 dark:text-slate-100 flex items-center gap-1 cursor-pointer">
|
||||
{is_admin ? t("admin") : t("user")}
|
||||
<IconArrowDown className="dark:fill-slate-50" />
|
||||
</span>
|
||||
</Tippy> :
|
||||
<span className="text-xs text-right text-gray-500 dark:text-slate-100 flex items-center gap-1">
|
||||
{is_admin ? t("admin") : t("user")}</span>}
|
||||
|
||||
{dotsVisible && (
|
||||
<Tippy
|
||||
interactive
|
||||
|
||||
@@ -76,7 +76,7 @@ const Reaction: FC<Props> = ({ mid, reactions = null, readOnly = false }) => {
|
||||
placement="top"
|
||||
content={<ReactionDetails uids={uids} emoji={reaction as keyof Emojis} index={idx} />}
|
||||
>
|
||||
<i className="emoji">
|
||||
<i className="emoji w-4 h-4">
|
||||
<ReactionItem native={reaction as keyof Emojis} />
|
||||
</i>
|
||||
</Tippy>
|
||||
|
||||
@@ -98,7 +98,7 @@ const Message: FC<IProps> = ({
|
||||
ref={inviewRef}
|
||||
className={clsx(`group w-full relative flex items-start gap-2 md:gap-4 px-1 md:px-2 py-1 my-2 rounded-lg md:dark:hover:bg-gray-800 md:hover:bg-gray-100`,
|
||||
readOnly && "hover:bg-transparent",
|
||||
showExpire && "bg-red-200",
|
||||
showExpire && "bg-red-200 dark:bg-red-200/40",
|
||||
pinInfo && "bg-cyan-50 dark:bg-cyan-800 pt-7"
|
||||
)}
|
||||
>
|
||||
|
||||
@@ -4,6 +4,7 @@ import { GuestRoutes } from "../../app/config";
|
||||
import { useGetInitializedQuery } from "../../app/services/auth";
|
||||
import { useGetLoginConfigQuery } from "../../app/services/server";
|
||||
import { useAppSelector } from "../../app/store";
|
||||
import Loading from "./Loading";
|
||||
|
||||
interface Props {
|
||||
children: ReactElement;
|
||||
@@ -14,15 +15,15 @@ const GuestAllows = GuestRoutes.map((path) => {
|
||||
});
|
||||
const RequireAuth: FC<Props> = ({ children, redirectTo = "/login" }) => {
|
||||
const location = useLocation();
|
||||
const matchs = matchRoutes(GuestAllows, location);
|
||||
const allowGuest = matchs ? !!matchs[0].pathname : false;
|
||||
const matches = matchRoutes(GuestAllows, location);
|
||||
const allowGuest = matches ? !!matches[0].pathname : false;
|
||||
const { data: loginConfig, isSuccess: loginConfigSuccess } = useGetLoginConfigQuery();
|
||||
const { isSuccess: checkInitialSuccess } = useGetInitializedQuery();
|
||||
const { token, guest, initialized } = useAppSelector((store) => store.authData);
|
||||
// console.log("auth route", { checkInitialSuccess, loginConfigSuccess, initialized, guest: loginConfig?.guest, token, allowGuest, guest });
|
||||
|
||||
// 初始化和login配置检查
|
||||
if (!checkInitialSuccess || !loginConfigSuccess) return null;
|
||||
if (!checkInitialSuccess || !loginConfigSuccess) return <Loading fullscreen={true} />;
|
||||
// 未初始化 则先走setup 流程
|
||||
if (!initialized) return <Navigate to={`/onboarding`} replace />;
|
||||
// 开启guest 并且没token 而且是允许guest访问的路由 则先去过渡页登录
|
||||
|
||||
Reference in New Issue
Block a user