Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-19 18:00:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Hotfix (#334)

Browse source 
* style(NavLinks.jsx): add 'as="div"' to Menu.Item components
refactor(Nav.jsx): remove unused code and add isMobile function to check if user is on mobile device

* conditionally render menuitem with search

---------

Co-authored-by: stunt_pilot <twitchstuntpilot@gmail.com>
This commit is contained in:
Danny Avila 2023-05-19 19:37:56 -04:00 • committed by GitHub
parent a9444b66a1
commit ab7cfc6041
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 42 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

52
client/src/components/Nav/index.jsx
View file

@ -13,25 +13,25 @@ import { useAuthContext } from '~/hooks/AuthContext';
import { ThemeContext } from '~/hooks/ThemeContext';
import { cn } from '~/utils/';
import resolveConfig from 'tailwindcss/resolveConfig';
const tailwindConfig = import('../../../tailwind.config.cjs');
const fullConfig = resolveConfig(tailwindConfig);
// import resolveConfig from 'tailwindcss/resolveConfig';
// const tailwindConfig = import('../../../tailwind.config.cjs');
// const fullConfig = resolveConfig(tailwindConfig);
export const getBreakpointValue = (value) =>
+fullConfig.theme.screens[value].slice(0, fullConfig.theme.screens[value].indexOf('px'));
// export const getBreakpointValue = (value) =>
// +fullConfig.theme.screens[value].slice(0, fullConfig.theme.screens[value].indexOf('px'));
export const getCurrentBreakpoint = () => {
let currentBreakpoint;
let biggestBreakpointValue = 0;
for (const breakpoint of Object.keys(fullConfig.theme.screens)) {
const breakpointValue = getBreakpointValue(breakpoint);
if (breakpointValue > biggestBreakpointValue && window.innerWidth >= breakpointValue) {
biggestBreakpointValue = breakpointValue;
currentBreakpoint = breakpoint;
}
}
return currentBreakpoint;
};
// export const getCurrentBreakpoint = () => {
// let currentBreakpoint;
// let biggestBreakpointValue = 0;
// for (const breakpoint of Object.keys(fullConfig.theme.screens)) {
// const breakpointValue = getBreakpointValue(breakpoint);
// if (breakpointValue > biggestBreakpointValue && window.innerWidth >= breakpointValue) {
// biggestBreakpointValue = breakpointValue;
// currentBreakpoint = breakpoint;
// }
// }
// return currentBreakpoint;
// };
export default function Nav({ navVisible, setNavVisible }) {
const [isHovering, setIsHovering] = useState(false);
@ -146,9 +146,23 @@ export default function Nav({ navVisible, setNavVisible }) {
setNavVisible((prev) => !prev);
};
// useEffect(() => {
// let currentBreakpoint = getCurrentBreakpoint();
// if (currentBreakpoint === 'sm') {
// setNavVisible(false);
// } else {
// setNavVisible(true);
// }
// }, [conversationId, setNavVisible]);
const isMobile = () => {
const userAgent = typeof window.navigator === 'undefined' ? '' : navigator.userAgent;
const mobileRegex = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i;
return mobileRegex.test(userAgent);
};
useEffect(() => {
let currentBreakpoint = getCurrentBreakpoint();
if (currentBreakpoint === 'sm') {
if (isMobile()) {
setNavVisible(false);
} else {
setNavVisible(true);