Avoid breaking changes

Signed-off-by: Philipp Hugenroth <philipph@spotify.com>

plugins/techdocs/src/reader/components/Reader.tsx

@@ -31,7 +31,7 @@ import { EntityName } from '@backstage/catalog-model';
 import { useApi, configApiRef } from '@backstage/core-plugin-api';
 import { scmIntegrationsApiRef } from '@backstage/integration-react';
 import { BackstageTheme } from '@backstage/theme';
-import { SidebarStateContext } from '@backstage/core-components';
+import { SidebarPinStateContext } from '@backstage/core-components';
 
 import { techdocsStorageApiRef } from '../../api';
 
@@ -146,7 +146,7 @@ export const useTechDocsReaderDom = (entityRef: EntityName): Element | null => {
   const [dom, setDom] = useState<HTMLElement | null>(null);
 
   // sidebar pinned status to be used in computing CSS style injections
-  const { isPinned } = useContext(SidebarStateContext);
+  const { isPinned } = useContext(SidebarPinStateContext);
 
   const updateSidebarPosition = useCallback(() => {
     if (!dom || !sidebars) return;

plugins/user-settings/src/components/General/UserSettingsAppearanceCard.tsx

@@ -13,14 +13,14 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { InfoCard, SidebarStateContext } from '@backstage/core-components';
+import { InfoCard, SidebarPinStateContext } from '@backstage/core-components';
 import { List } from '@material-ui/core';
 import React, { useContext } from 'react';
 import { UserSettingsPinToggle } from './UserSettingsPinToggle';
 import { UserSettingsThemeToggle } from './UserSettingsThemeToggle';
 
 export const UserSettingsAppearanceCard = () => {
-  const { isMobile } = useContext(SidebarStateContext);
+  const { isMobile } = useContext(SidebarPinStateContext);
 
   return (
     <InfoCard title="Appearance" variant="gridItem">

plugins/user-settings/src/components/General/UserSettingsPinToggle.test.tsx

@@ -18,14 +18,14 @@ import { renderWithEffects, wrapInTestApp } from '@backstage/test-utils';
 import { fireEvent } from '@testing-library/react';
 import React from 'react';
 import { UserSettingsPinToggle } from './UserSettingsPinToggle';
-import { SidebarStateContext } from '@backstage/core-components';
+import { SidebarPinStateContext } from '@backstage/core-components';
 
 describe('<UserSettingsPinToggle />', () => {
   it('toggles the pin sidebar button', async () => {
     const mockToggleFn = jest.fn();
     const rendered = await renderWithEffects(
       wrapInTestApp(
-        <SidebarStateContext.Provider
+        <SidebarPinStateContext.Provider
           value={{
             isPinned: false,
             isMobile: false,
@@ -33,7 +33,7 @@ describe('<UserSettingsPinToggle />', () => {
           }}
         >
           <UserSettingsPinToggle />
-        </SidebarStateContext.Provider>,
+        </SidebarPinStateContext.Provider>,
       ),
     );
     expect(rendered.getByText('Pin Sidebar')).toBeInTheDocument();

plugins/user-settings/src/components/General/UserSettingsPinToggle.tsx

@@ -22,10 +22,12 @@ import {
   Switch,
   Tooltip,
 } from '@material-ui/core';
-import { SidebarStateContext } from '@backstage/core-components';
+import { SidebarPinStateContext } from '@backstage/core-components';
 
 export const UserSettingsPinToggle = () => {
-  const { isPinned, toggleSidebarPinState } = useContext(SidebarStateContext);
+  const { isPinned, toggleSidebarPinState } = useContext(
+    SidebarPinStateContext,
+  );
 
   return (
     <ListItem>

plugins/user-settings/src/components/SettingsPage.tsx

@@ -17,7 +17,7 @@
 import {
   Header,
   Page,
-  SidebarStateContext,
+  SidebarPinStateContext,
   TabbedLayout,
 } from '@backstage/core-components';
 import React, { useContext } from 'react';
@@ -30,7 +30,7 @@ type Props = {
 };
 
 export const SettingsPage = ({ providerSettings }: Props) => {
-  const { isMobile } = useContext(SidebarStateContext);
+  const { isMobile } = useContext(SidebarPinStateContext);
 
   return (
     <Page themeId="home">