diff --git a/src/common/AsideMenu.scss b/src/common/AsideMenu.scss index 8f1f075e..4e7e462d 100644 --- a/src/common/AsideMenu.scss +++ b/src/common/AsideMenu.scss @@ -58,24 +58,6 @@ background-color: var(--brand-color); } -.aside-menu__item--divider { - border-bottom: 1px solid #eeeeee; - margin: 20px 0; -} - -.aside-menu__item--danger { - color: $dangerColor; -} - -.aside-menu__item--push { - margin-top: auto; -} - -.aside-menu__item--danger:hover { - color: #ffffff; - background-color: $dangerColor; -} - .aside-menu__item-text { margin-left: 8px; } diff --git a/src/common/AsideMenu.tsx b/src/common/AsideMenu.tsx index 9d6d1886..abd87866 100644 --- a/src/common/AsideMenu.tsx +++ b/src/common/AsideMenu.tsx @@ -3,7 +3,6 @@ import { faHome as overviewIcon, faLink as createIcon, faList as listIcon, - faPen as editIcon, faTags as tagsIcon, } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; @@ -13,7 +12,6 @@ import type { NavLinkProps } from 'react-router-dom'; import { NavLink, useLocation } from 'react-router-dom'; import type { SelectedServer } from '../servers/data'; import { isServerWithId } from '../servers/data'; -import type { DeleteServerButtonProps } from '../servers/DeleteServerButton'; import './AsideMenu.scss'; export interface AsideMenuProps { @@ -36,9 +34,7 @@ const AsideMenuItem: FC = ({ children, to, className, ...res ); -export const AsideMenu = (DeleteServerButton: FC) => ( - { selectedServer, showOnMobile = false }: AsideMenuProps, -) => { +export const AsideMenu: FC = ({ selectedServer, showOnMobile = false }) => { const hasId = isServerWithId(selectedServer); const serverId = hasId ? selectedServer.id : ''; const { pathname } = useLocation(); @@ -73,17 +69,6 @@ export const AsideMenu = (DeleteServerButton: FC) => ( Manage domains - - - Edit this server - - {hasId && ( - - )} ); diff --git a/src/common/MenuLayout.tsx b/src/common/MenuLayout.tsx index 092db5bb..288abc96 100644 --- a/src/common/MenuLayout.tsx +++ b/src/common/MenuLayout.tsx @@ -8,7 +8,7 @@ import { isReachableServer } from '../servers/data'; import { withSelectedServer } from '../servers/helpers/withSelectedServer'; import { useFeature } from '../utils/helpers/features'; import { useSwipeable, useToggle } from '../utils/helpers/hooks'; -import type { AsideMenuProps } from './AsideMenu'; +import { AsideMenu } from './AsideMenu'; import { NotFound } from './NotFound'; import './MenuLayout.scss'; @@ -20,7 +20,6 @@ interface MenuLayoutProps { export const MenuLayout = ( TagsList: FC, ShortUrlsList: FC, - AsideMenu: FC, CreateShortUrl: FC, ShortUrlVisits: FC, TagVisits: FC, diff --git a/src/common/services/provideServices.ts b/src/common/services/provideServices.ts index 23439654..5711a401 100644 --- a/src/common/services/provideServices.ts +++ b/src/common/services/provideServices.ts @@ -1,7 +1,6 @@ import type Bottle from 'bottlejs'; import type { ConnectDecorator } from '../../container/types'; import { withoutSelectedServer } from '../../servers/helpers/withoutSelectedServer'; -import { AsideMenu } from '../AsideMenu'; import { ErrorHandler } from '../ErrorHandler'; import { Home } from '../Home'; import { MainHeader } from '../MainHeader'; @@ -37,7 +36,6 @@ export const provideServices = (bottle: Bottle, connect: ConnectDecorator) => { MenuLayout, 'TagsList', 'ShortUrlsList', - 'AsideMenu', 'CreateShortUrl', 'ShortUrlVisits', 'TagVisits', @@ -51,8 +49,6 @@ export const provideServices = (bottle: Bottle, connect: ConnectDecorator) => { ); bottle.decorator('MenuLayout', connect(['selectedServer'], ['selectServer', 'sidebarPresent', 'sidebarNotPresent'])); - bottle.serviceFactory('AsideMenu', AsideMenu, 'DeleteServerButton'); - bottle.serviceFactory('ShlinkVersionsContainer', () => ShlinkVersionsContainer); bottle.decorator('ShlinkVersionsContainer', connect(['selectedServer', 'sidebar'])); diff --git a/src/utils/theme/index.ts b/src/utils/theme/index.ts index 39ebb02a..970ef398 100644 --- a/src/utils/theme/index.ts +++ b/src/utils/theme/index.ts @@ -12,8 +12,6 @@ export const PRIMARY_DARK_COLOR = '#161b22'; export type Theme = 'dark' | 'light'; -export const changeThemeInMarkup = (theme: Theme) => - document.getElementsByTagName('html')?.[0]?.setAttribute('data-theme', theme); +export const changeThemeInMarkup = (theme: Theme) => document.querySelector('html')?.setAttribute('data-theme', theme); -export const isDarkThemeEnabled = (): boolean => - document.getElementsByTagName('html')?.[0]?.getAttribute('data-theme') === 'dark'; +export const isDarkThemeEnabled = (): boolean => document.querySelector('html')?.getAttribute('data-theme') === 'dark'; diff --git a/test/common/AsideMenu.test.tsx b/test/common/AsideMenu.test.tsx index 9a4f7d25..fac3fe61 100644 --- a/test/common/AsideMenu.test.tsx +++ b/test/common/AsideMenu.test.tsx @@ -1,13 +1,12 @@ import { render, screen } from '@testing-library/react'; import { fromPartial } from '@total-typescript/shoehorn'; import { MemoryRouter } from 'react-router'; -import { AsideMenu as createAsideMenu } from '../../src/common/AsideMenu'; +import { AsideMenu } from '../../src/common/AsideMenu'; describe('', () => { - const AsideMenu = createAsideMenu(() => <>DeleteServerButton); - const setUp = (id: string | false = 'abc123') => render( + const setUp = () => render( - + , ); @@ -17,20 +16,7 @@ describe('', () => { const links = screen.getAllByRole('link'); expect.assertions(links.length + 1); - expect(links).toHaveLength(6); + expect(links).toHaveLength(5); links.forEach((link) => expect(link.getAttribute('href')).toContain('abc123')); }); - - it.each([ - ['abc', true], - [false, false], - ])('contains a button to delete server if appropriate', (id, shouldHaveBtn) => { - setUp(id as string | false); - - if (shouldHaveBtn) { - expect(screen.getByText('DeleteServerButton')).toBeInTheDocument(); - } else { - expect(screen.queryByText('DeleteServerButton')).not.toBeInTheDocument(); - } - }); }); diff --git a/test/common/MenuLayout.test.tsx b/test/common/MenuLayout.test.tsx index a916c47d..08c940e6 100644 --- a/test/common/MenuLayout.test.tsx +++ b/test/common/MenuLayout.test.tsx @@ -6,13 +6,15 @@ import { MenuLayout as createMenuLayout } from '../../src/common/MenuLayout'; import type { NonReachableServer, NotFoundServer, SelectedServer } from '../../src/servers/data'; import type { SemVer } from '../../src/utils/helpers/version'; -vi.mock('react-router-dom', async () => ({ ...(await vi.importActual('react-router-dom')), useParams: vi.fn() })); +vi.mock('react-router-dom', async () => ({ + ...(await vi.importActual('react-router-dom')), + useParams: vi.fn(), +})); describe('', () => { const MenuLayout = createMenuLayout( () => <>TagsList, () => <>ShortUrlsList, - () => <>AsideMenu, () => <>CreateShortUrl, () => <>ShortUrlVisits, () => <>TagVisits, @@ -20,7 +22,7 @@ describe('', () => { () => <>OrphanVisits, () => <>NonOrphanVisits, () => <>ServerError, - () => <>Overview, + () => <>OverviewRoute, () => <>EditShortUrl, () => <>ManageDomains, ); @@ -62,7 +64,7 @@ describe('', () => { }); it.each([ - ['3.0.0' as SemVer, '/overview', 'Overview'], + ['3.0.0' as SemVer, '/overview', 'OverviewRoute'], ['3.0.0' as SemVer, '/list-short-urls/1', 'ShortUrlsList'], ['3.0.0' as SemVer, '/create-short-url', 'CreateShortUrl'], ['3.0.0' as SemVer, '/short-code/abc123/visits/foo', 'ShortUrlVisits'],