diff --git a/src/app/components/AppendMobileSearch/index.tsx b/src/app/components/AppendMobileSearch/index.tsx index 0211fc6282..97fc780a39 100644 --- a/src/app/components/AppendMobileSearch/index.tsx +++ b/src/app/components/AppendMobileSearch/index.tsx @@ -7,6 +7,7 @@ import { SearchScope } from '../../../types/searchScope' interface AppendMobileSearchProps { action?: ReactNode + enableMobileSearch?: boolean } interface AppendMobileSearchLayoutProps { @@ -41,6 +42,7 @@ export const AppendMobileSearch: FC & scope, children, action, + enableMobileSearch = true, }) => { const { isMobile } = useScreenSize() @@ -50,7 +52,7 @@ export const AppendMobileSearch: FC & {action} - {isMobile && ( + {isMobile && enableMobileSearch && ( diff --git a/src/app/components/PageLayout/Footer.tsx b/src/app/components/PageLayout/Footer.tsx index 789c673639..348d8570b4 100644 --- a/src/app/components/PageLayout/Footer.tsx +++ b/src/app/components/PageLayout/Footer.tsx @@ -12,11 +12,13 @@ import { SearchScope } from '../../../types/searchScope' import { api, github } from '../../utils/externalLinks' import { ReopenAnalyticsConsentButton } from 'app/components/AnalyticsConsent' -const FooterBox = styled(Box)(({ theme }) => ({ +const FooterBox = styled(Box, { + shouldForwardProp: prop => prop !== 'enableMobileSearch', +})<{ enableMobileSearch: boolean }>(({ theme, enableMobileSearch }) => ({ display: 'flex', width: '100%', justifyContent: 'space-between', - padding: theme.spacing(5, 4), + padding: theme.spacing(5, enableMobileSearch ? 4 : 0), [theme.breakpoints.up('sm')]: { flex: '0 1 100%', padding: theme.spacing(5, 0), @@ -44,9 +46,10 @@ const StyledTypography = styled(Typography)(() => ({ interface FooterProps { scope?: SearchScope mobileSearchAction?: ReactNode + enableMobileSearch?: boolean } -export const Footer: FC = ({ scope, mobileSearchAction }) => { +export const Footer: FC = ({ scope, mobileSearchAction, enableMobileSearch = true }) => { const theme = useTheme() const { t } = useTranslation() const { isMobile, isTablet } = useScreenSize() @@ -56,9 +59,13 @@ export const Footer: FC = ({ scope, mobileSearchAction }) => { return (