diff --git a/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx b/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx index 3859b2aa1e..7669a48c26 100644 --- a/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx +++ b/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx @@ -56,7 +56,10 @@ export const CreatePlaylistButton = () => { [errorApi, navigate, playlistApi, playlistRoute], ); - const singularTitle = useTitle(false, false); + const singularTitle = useTitle({ + pluralize: false, + lowerCase: false, + }); return ( <> diff --git a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx index 711858577a..150ca6bc56 100644 --- a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx +++ b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx @@ -105,9 +105,18 @@ export const EntityPlaylistDialog = (props: EntityPlaylistDialogProps) => { [playlistApi], ); - const singularTitle = useTitle(true, false); - const singularTitleLowerCase = useTitle(false, true); - const plurlaTitleLowerCase = useTitle(true, true); + const singularTitle = useTitle({ + pluralize: true, + lowerCase: false, + }); + const singularTitleLowerCase = useTitle({ + pluralize: false, + lowerCase: true, + }); + const pluralTitleLowerCase = useTitle({ + pluralize: true, + lowerCase: true, + }); useEffect(() => { if (open) { @@ -204,7 +213,7 @@ export const EntityPlaylistDialog = (props: EntityPlaylistDialogProps) => { {error && ( )} diff --git a/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.tsx b/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.tsx index 1989f25ae7..a213c7c51c 100644 --- a/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.tsx +++ b/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.tsx @@ -106,7 +106,10 @@ export const PlaylistEditDialog = ({ } }; - const titleSingularLowerCase = useTitle(false, false); + const titleSingularLowerCase = useTitle({ + pluralize: false, + lowerCase: false, + }); return ( @@ -124,7 +127,7 @@ export const PlaylistEditDialog = ({ fullWidth label="Name" margin="dense" - placeholder={`Give your ${titleSingularLowerCase} name`} + placeholder={`Give your ${titleSingularLowerCase} a name`} required type="text" /> diff --git a/plugins/playlist/src/components/PlaylistIndexPage/PlaylistIndexPage.tsx b/plugins/playlist/src/components/PlaylistIndexPage/PlaylistIndexPage.tsx index eabce5d0c6..f25df19ee7 100644 --- a/plugins/playlist/src/components/PlaylistIndexPage/PlaylistIndexPage.tsx +++ b/plugins/playlist/src/components/PlaylistIndexPage/PlaylistIndexPage.tsx @@ -32,7 +32,10 @@ import { PlaylistSearchBar } from '../PlaylistSearchBar'; import { PlaylistSortPicker } from '../PlaylistSortPicker'; export const PlaylistIndexPage = () => { - const pluralTitle = useTitle(true, false); + const pluralTitle = useTitle({ + pluralize: true, + lowerCase: false, + }); return ( diff --git a/plugins/playlist/src/components/PlaylistList/PlaylistList.test.tsx b/plugins/playlist/src/components/PlaylistList/PlaylistList.test.tsx index 27030ec1c7..976db99983 100644 --- a/plugins/playlist/src/components/PlaylistList/PlaylistList.test.tsx +++ b/plugins/playlist/src/components/PlaylistList/PlaylistList.test.tsx @@ -14,13 +14,19 @@ * limitations under the License. */ +import { ConfigApi, configApiRef } from '@backstage/core-plugin-api'; import { Playlist } from '@backstage/plugin-playlist-common'; +import { TestApiProvider } from '@backstage/test-utils'; import { render } from '@testing-library/react'; import React from 'react'; import { MockPlaylistListProvider } from '../../testUtils'; import { PlaylistList } from './PlaylistList'; +const mockConfigApi = { + getOptionalString: () => undefined, +} as Partial; + jest.mock('../PlaylistCard', () => ({ PlaylistCard: ({ playlist }: { playlist: Playlist }) => (
{playlist.name}
@@ -30,9 +36,11 @@ jest.mock('../PlaylistCard', () => ({ describe('', () => { it('renders error on error', () => { const rendered = render( - - - , + + + + + , ); expect(rendered.getByText('Test Error')).toBeInTheDocument(); @@ -40,9 +48,11 @@ describe('', () => { it('handles no playlists', () => { const rendered = render( - - - , + + + + + , ); expect( @@ -52,32 +62,34 @@ describe('', () => { it('renders playlists', () => { const rendered = render( - - - , + + + + + , ); expect(rendered.getByText('playlist-1')).toBeInTheDocument(); diff --git a/plugins/playlist/src/components/PlaylistList/PlaylistList.tsx b/plugins/playlist/src/components/PlaylistList/PlaylistList.tsx index 6c90914c49..2f815f07c6 100644 --- a/plugins/playlist/src/components/PlaylistList/PlaylistList.tsx +++ b/plugins/playlist/src/components/PlaylistList/PlaylistList.tsx @@ -28,7 +28,10 @@ import { PlaylistCard } from '../PlaylistCard'; export const PlaylistList = () => { const { loading, error, playlists } = usePlaylistList(); - const pluralTitleLowerCase = useTitle(true, true); + const pluralTitleLowerCase = useTitle({ + pluralize: true, + lowerCase: true, + }); return ( <> diff --git a/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.tsx b/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.tsx index 69a6beadb2..3d8efe3bc5 100644 --- a/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.tsx +++ b/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.tsx @@ -85,7 +85,10 @@ export const PlaylistEntitiesTable = ({ [errorApi, loadEntities, playlistApi, playlistId], ); - const singularTitleLowerCase = useTitle(false, true); + const singularTitleLowerCase = useTitle({ + pluralize: false, + lowerCase: true, + }); const actions = editAllowed ? [ diff --git a/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx b/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx index 8ead799db2..621f94f75c 100644 --- a/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx +++ b/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx @@ -110,7 +110,10 @@ export const PlaylistHeader = ({ playlist, onUpdate }: PlaylistHeaderProps) => { } }, [playlistApi]); - const singularTitle = useTitle(false, false); + const singularTitle = useTitle({ + pluralize: false, + lowerCase: false, + }); return (