diff --git a/bldrs-ai-conway-0.1.543.tgz b/bldrs-ai-conway-0.1.543.tgz deleted file mode 100644 index 3a4ccf135..000000000 Binary files a/bldrs-ai-conway-0.1.543.tgz and /dev/null differ diff --git a/bldrs-ai-conway-0.1.546.tgz b/bldrs-ai-conway-0.1.546.tgz new file mode 100644 index 000000000..1457baeff Binary files /dev/null and b/bldrs-ai-conway-0.1.546.tgz differ diff --git a/package.json b/package.json index 983fe31bb..9d2b28347 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bldrs", - "version": "1.0.1047", + "version": "1.0.1073", "main": "src/index.jsx", "license": "AGPL-3.0", "homepage": "https://github.com/bldrs-ai/Share", @@ -57,7 +57,7 @@ "@babel/plugin-syntax-import-assertions": "7.18.6", "@babel/preset-env": "7.18.10", "@babel/preset-react": "7.18.6", - "@bldrs-ai/conway": "./bldrs-ai-conway-0.1.543.tgz", + "@bldrs-ai/conway": "./bldrs-ai-conway-0.1.546.tgz", "@bldrs-ai/ifclib": "5.3.3", "@emotion/react": "11.10.0", "@emotion/styled": "11.10.0", diff --git a/src/Components/About/AboutDialog.jsx b/src/Components/About/AboutDialog.jsx index 1cdda834e..1c62082e0 100644 --- a/src/Components/About/AboutDialog.jsx +++ b/src/Components/About/AboutDialog.jsx @@ -8,9 +8,7 @@ import Dialog from '../Dialog' import {LogoBWithDomain} from '../Logo/Logo' // TODO(pablo): re-enable after prod freeze bug fixed // import PrivacyControl from './PrivacyControl' -import LinkedInIcon from '@mui/icons-material/LinkedIn' import GitHubIcon from '@mui/icons-material/GitHub' -import TwitterIcon from '@mui/icons-material/Twitter' import DiscordIcon from '../../assets/icons/Discord.svg' @@ -61,7 +59,7 @@ function AboutContent() { justifyContent='center' alignItems='center' > - + window.open(`https://discord.gg/9SxguBkFfQ`, '_blank')} @@ -69,20 +67,6 @@ function AboutContent() { placement='bottom' variant='noBackground' /> - window.open(`https://twitter.com/bldrs_ai`, '_blank')} - icon={} - placement='bottom' - variant='noBackground' - /> - window.open(`https://www.linkedin.com/company/bldrs-ai/`, '_blank')} - icon={} - placement='bottom' - variant='noBackground' - /> window.open(`https://github.com/bldrs-ai/Share`, '_blank')} diff --git a/src/Components/AlertDialog.jsx b/src/Components/AlertDialog.jsx index e1fe16614..49cfee942 100644 --- a/src/Components/AlertDialog.jsx +++ b/src/Components/AlertDialog.jsx @@ -1,34 +1,122 @@ import React, {ReactElement} from 'react' +import Box from '@mui/material/Box' import Dialog from '@mui/material/Dialog' import DialogActions from '@mui/material/DialogActions' import DialogContent from '@mui/material/DialogContent' import DialogTitle from '@mui/material/DialogTitle' -import IconButton from '@mui/material/IconButton' +import Link from '@mui/material/Link' +import List from '@mui/material/List' +import ListItem from '@mui/material/ListItem' +import ListItemText from '@mui/material/ListItemText' +import Paper from '@mui/material/Paper' +import Stack from '@mui/material/Stack' +import Typography from '@mui/material/Typography' +import {RectangularButton} from '../Components/Buttons' import useStore from '../store/useStore' -import CheckIcon from '@mui/icons-material/Check' +import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline' +import useTheme from '@mui/styles/useTheme' /** @return {ReactElement} */ export default function AlertDialog({onClose, children}) { - const alertMessage = useStore((state) => state.alertMessage) - const setAlertMessage = useStore((state) => state.setAlertMessage) + const errorPath = useStore((state) => state.errorPath) + const setErrorPath = useStore((state) => state.setErrorPath) + const theme = useTheme() const onCloseInner = () => { - setAlertMessage(null) + setErrorPath(null) onClose() } return ( - {'Alert'} - - {alertMessage} + + + + + + + + + + + + + Could not load the model + + } + primaryTypographyProps={{variant: 'body1'}} + /> + + + + + + + Check the file path: +
+ {errorPath} + + } + /> + + + + Contact us on our{' '} + + Discord + {' '} + for help + + } + /> + + + - - + + ) diff --git a/src/Components/Buttons.jsx b/src/Components/Buttons.jsx index 21a3812f3..8e9ccb593 100644 --- a/src/Components/Buttons.jsx +++ b/src/Components/Buttons.jsx @@ -189,15 +189,13 @@ export function RectangularButton({ title, onClick, icon = null, - border = false, - background = true, disabled = false, }) { assertDefined(title, onClick) return ( icon ? - : - + : + ) } diff --git a/src/Components/Profile/ProfileControl.jsx b/src/Components/Profile/ProfileControl.jsx index d5038bc26..b53a735dc 100644 --- a/src/Components/Profile/ProfileControl.jsx +++ b/src/Components/Profile/ProfileControl.jsx @@ -1,5 +1,6 @@ import React, {ReactElement, useEffect, useState} from 'react' import Avatar from '@mui/material/Avatar' +import Divider from '@mui/material/Divider' import Menu from '@mui/material/Menu' import MenuItem from '@mui/material/MenuItem' import Typography from '@mui/material/Typography' @@ -9,6 +10,9 @@ import AccountBoxOutlinedIcon from '@mui/icons-material/AccountBoxOutlined' import GitHubIcon from '@mui/icons-material/GitHub' import NightlightOutlinedIcon from '@mui/icons-material/NightlightOutlined' import WbSunnyOutlinedIcon from '@mui/icons-material/WbSunnyOutlined' +import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined' +import LoginOutlinedIcon from '@mui/icons-material/LoginOutlined' +import LogoutOutlinedIcon from '@mui/icons-material/LogoutOutlined' import {useAuth0} from '../../Auth0/Auth0Proxy' @@ -27,6 +31,7 @@ export default function ProfileControl() { const [isDay, setIsDay] = useState(theme.palette.mode === 'light') const onLoginClick = async () => { + onCloseClick() await loginWithPopup({ appState: { returnTo: window.location.pathname, @@ -35,6 +40,7 @@ export default function ProfileControl() { } const onLogoutClick = () => { logout({returnTo: process.env.OAUTH2_REDIRECT_URI || window.location.origin}) + onCloseClick() } const onCloseClick = () => setAnchorEl(null) @@ -64,17 +70,35 @@ export default function ProfileControl() { onClose={onCloseClick} anchorOrigin={{vertical: 'top', horizontal: 'left'}} transformOrigin={{vertical: 'top', horizontal: 'right'}} + sx={{transform: 'translateX(-1em)'}} + > - + {isAuthenticated ? - Log out : - Log in with Github} + <> + + Log out + : + <> + + Log in with Github + + } + + window.open(`https://github.com/signup`, '_blank')} data-testid='link-join-github'> + + Join GitHub + + window.open(`https://github.com/bldrs-ai/Share/wiki`, '_blank')} data-testid='link-bldrs-wiki'> + + Bldrs Wiki + { - onCloseClick() theme.toggleColorMode() + onCloseClick() }} data-testid={`change-theme-to-${isDay ? 'night' : 'day'}`} > diff --git a/src/Components/Profile/ProfileControl.test.jsx b/src/Components/Profile/ProfileControl.test.jsx index 854a903e8..006f655ee 100644 --- a/src/Components/Profile/ProfileControl.test.jsx +++ b/src/Components/Profile/ProfileControl.test.jsx @@ -6,14 +6,18 @@ import LoginMenu from './ProfileControl' describe('ProfileControl', () => { - it('renders the login button when not logged in', async () => { + it('renders the login button when not logged in, and other links', async () => { mockedUseAuth0.mockReturnValue(mockedUserLoggedOut) const {findByTestId, findByText} = render(, {wrapper: ThemeCtx}) const usersMenu = await findByTestId('control-button-profile') fireEvent.click(usersMenu) const LoginWithGithub = await findByText('Log in with Github') + const JoinGithub = await findByText('Join GitHub') + const BldrsWiki = await findByText('Bldrs Wiki') expect(LoginWithGithub).toBeInTheDocument() + expect(JoinGithub).toBeInTheDocument() + expect(BldrsWiki).toBeInTheDocument() }) it('renders the user avatar when logged in', async () => { diff --git a/src/Components/Search/SearchBar.jsx b/src/Components/Search/SearchBar.jsx index 7953dac1f..5f910f135 100644 --- a/src/Components/Search/SearchBar.jsx +++ b/src/Components/Search/SearchBar.jsx @@ -1,6 +1,8 @@ import React, {ReactElement, useRef, useEffect, useState} from 'react' import {useLocation, useNavigate, useSearchParams} from 'react-router-dom' import Autocomplete from '@mui/material/Autocomplete' +import InputAdornment from '@mui/material/InputAdornment' +import IconButton from '@mui/material/IconButton' import TextField from '@mui/material/TextField' import {looksLikeLink, githubUrlOrPathToSharePath} from '../../net/github/utils' import {handleBeforeUnload} from '../../utils/event' @@ -75,15 +77,23 @@ export default function SearchBar() { searchInputRef.current.blur() } + const handleKeyDown = (event) => { + if (event.key === 'Enter' && !event.shiftKey) { + event.preventDefault() + onSubmit(event) + } + } + // The container and paper are set to 100% width to fill the // container SearchBar shares with NavTreePanel. This is an easier // way to have them share the same width, which is now set in the // parent container (CadView). return ( -
+ setInputText(newValue || '')} @@ -98,10 +108,26 @@ export default function SearchBar() { error={!!error.length} placeholder='Search' variant='outlined' - sx={{ - width: '100%', - }} + multiline + onKeyDown={handleKeyDown} data-testid='textfield-search-query' + InputProps={{ + endAdornment: ( + + setInputText('')} + sx={{height: '2em', width: '2em'}} + > + + + + ), + }} /> )} /> diff --git a/src/Components/Versions/VersionsPanel.jsx b/src/Components/Versions/VersionsPanel.jsx index e82e2625d..8ce2a2067 100644 --- a/src/Components/Versions/VersionsPanel.jsx +++ b/src/Components/Versions/VersionsPanel.jsx @@ -93,6 +93,7 @@ export default function VersionsPanel({filePath, currentRef}) { size='small' /> } + sx={{m: '0 0 0 10px'}} // equal to SearchBar m:5 + p:5 onCloseClick={() => setIsVersionsVisible(false)} data-testid='Version Panel' > diff --git a/src/Containers/AlertDialogAndSnackbar.jsx b/src/Containers/AlertDialogAndSnackbar.jsx index 417aa24f5..d41262e35 100644 --- a/src/Containers/AlertDialogAndSnackbar.jsx +++ b/src/Containers/AlertDialogAndSnackbar.jsx @@ -2,12 +2,12 @@ import React, {ReactElement, useEffect, useState} from 'react' import {useNavigate} from 'react-router-dom' import IconButton from '@mui/material/IconButton' import Snackbar from '@mui/material/Snackbar' -import Stack from '@mui/material/Stack' import AlertDialog from '../Components/AlertDialog' import {navToDefault} from '../Share' import useStore from '../store/useStore' import {assert} from '../utils/assert' import CloseIcon from '@mui/icons-material/Close' +import {Typography} from '@mui/material' /** @return {ReactElement} */ @@ -44,7 +44,6 @@ export default function AlertAndSnackbar() { setIsSnackOpen(true) }, [snackMessage, setIsSnackOpen]) - return ( <> setIsSnackOpen(false)} + action={ + setIsSnackOpen(false)} + size='small' + sx={{marginRight: '-.5em'}} + > + + + } message={ - - {text} - setIsSnackOpen(false)}> - + + {text} + } data-testid='snackbar' /> diff --git a/src/Containers/CadView.jsx b/src/Containers/CadView.jsx index 09b907ba6..827727545 100644 --- a/src/Containers/CadView.jsx +++ b/src/Containers/CadView.jsx @@ -2,7 +2,6 @@ import React, {ReactElement, useEffect, useState} from 'react' import {useNavigate, useSearchParams, useLocation} from 'react-router-dom' import {MeshLambertMaterial} from 'three' import Box from '@mui/material/Box' -import Typography from '@mui/material/Typography' import useTheme from '@mui/styles/useTheme' import {filetypeRegex} from '../Filetype' import {useAuth0} from '../Auth0/Auth0Proxy' @@ -99,7 +98,7 @@ export default function CadView({ const modelPath = useStore((state) => state.modelPath) // UISlice - const setAlertMessage = useStore((state) => state.setAlertMessage) + const setErrorPath = useStore((state) => state.setErrorPath) const setIsCutPlaneActive = useStore((state) => state.setIsCutPlaneActive) const setSnackMessage = useStore((state) => state.setSnackMessage) @@ -185,7 +184,6 @@ export default function CadView({ viewer.IFC.selector.preselection.material = preselectMat viewer.IFC.selector.selection.material = selectMat } - const pathToLoad = modelPath.gitpath || (installPrefix + modelPath.filepath) let tmpModelRef try { @@ -198,17 +196,12 @@ export default function CadView({ debug().log(`CadView#onViewer, pathToLoad(${pathToLoad}) tmpModelRef(${tmpModelRef}`) if (tmpModelRef === undefined || tmpModelRef === null) { - setAlertMessage( - <> - Could not load model - {pathToLoad} - ) + setErrorPath(pathToLoad) return } // Leave snack message until here so alert box handler can clear // it after user says OK. setSnackMessage(null) - debug().log('CadView#onViewer: tmpModelRef: ', tmpModelRef) await onModel(tmpModelRef) createPlaceMark({ @@ -385,7 +378,7 @@ export default function CadView({ debug().log('CadView#loadIfc$onError: ', error) // TODO(pablo): error modal. setIsModelLoading(false) - setAlertMessage(`Could not load file: ${filepath}. Please try logging in if the repository is private.`) + setErrorPath(filePath) }, customViewSettings) } diff --git a/src/Containers/ControlsGroupAndDrawer.jsx b/src/Containers/ControlsGroupAndDrawer.jsx index 7e63fedb3..576123d50 100644 --- a/src/Containers/ControlsGroupAndDrawer.jsx +++ b/src/Containers/ControlsGroupAndDrawer.jsx @@ -85,7 +85,6 @@ export default function ControlsGroupAndDrawer({ {isSearchEnabled && isSearchBarVisible && } - {isNavTreeEnabled && isNavTreeVisible && model && diff --git a/src/Styles.jsx b/src/Styles.jsx index 3cf3f3662..62c6ccc7f 100644 --- a/src/Styles.jsx +++ b/src/Styles.jsx @@ -1,9 +1,8 @@ import React from 'react' import GlobalStyles from '@mui/material/GlobalStyles' - /** - * @property {object} theme To set link, icon and scollbar colors. + * @property {object} theme To set link, icon and scrollbar colors. * @return {React.Component} */ export default function Styles({theme}) { @@ -17,6 +16,22 @@ export default function Styles({theme}) { height: '100%', maxHeight: '100%', }, + '@media (max-width: 768px)': { + html: { + height: '100%', + maxHeight: '100%', + overflow: 'hidden', + overscrollBehavior: 'none', + }, + body: { + position: 'fixed', + left: 0, + top: 0, + right: 0, + bottom: 0, + maxHeight: '100%', + }, + }, 'a': { color: theme.palette.primary.main, }, @@ -33,7 +48,7 @@ export default function Styles({theme}) { top: 0, right: 0, margin: '0.5em', - opacity: .5, + opacity: 0.5, }, '.MuiDialogActions-root': { textAlign: 'center', diff --git a/src/store/UISlice.js b/src/store/UISlice.js index d14cd1545..2dc982b21 100644 --- a/src/store/UISlice.js +++ b/src/store/UISlice.js @@ -18,8 +18,8 @@ const isThemeEnabled = process.env.THEME_IS_ENABLED */ export default function createUISlice(set, get) { return { - alertMessage: null, - setAlertMessage: (msg) => set(() => ({alertMessage: msg})), + errorPath: null, + setErrorPath: (path) => set(() => ({errorPath: path})), appStoreSidebarWidth: MOBILE_WIDTH, setAppStoreSidebarWidth: (width) => set(() => ({appStoreSidebarWidth: width})), diff --git a/src/theme/Components.js b/src/theme/Components.js index ffef2ab72..545dc52eb 100644 --- a/src/theme/Components.js +++ b/src/theme/Components.js @@ -146,9 +146,16 @@ export function getComponentOverrides(palette, typography) { MuiListItem: { styleOverrides: { root: { - padding: '0.5em 0', + padding: '.5em 0', }, }, + variants: [{ + // Used in HelpControl to indicate activity state + props: {variant: 'alert'}, + style: { + padding: '.2em 0', + }, + }], }, MuiMenuItem: { styleOverrides: { @@ -197,10 +204,17 @@ export function getComponentOverrides(palette, typography) { }, }, }, + MuiLink: { + styleOverrides: { + root: { + color: palette.primary.contrastText, + textDecoration: 'underline', + }, + }, + }, MuiSnackbarContent: { styleOverrides: { root: { - // backgroundColor: palette.primary.main, borderRadius: '10px', }, }, @@ -224,9 +238,7 @@ export function getComponentOverrides(palette, typography) { MuiTextField: { styleOverrides: { root: { - // backgroundColor: palette.primary.main, borderRadius: '10px', - // opacity: .9, }, }, }, diff --git a/yarn.lock b/yarn.lock index 411027fd5..a823c84a2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2078,9 +2078,9 @@ resolved "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz" integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw== -"@bldrs-ai/conway@./bldrs-ai-conway-0.1.543.tgz": - version "0.1.543" - resolved "./bldrs-ai-conway-0.1.543.tgz#943bd79db8c4332a0cd68e117b94520f5ce8d288" +"@bldrs-ai/conway@./bldrs-ai-conway-0.1.546.tgz": + version "0.1.546" + resolved "./bldrs-ai-conway-0.1.546.tgz#7bac1ec9140c7a20840f980e6b5227316905e956" dependencies: buffer "^6.0.3" gl-matrix "^3.4.3"