Move type to shared module to avoid dependency from shared to sidebar store module

src/annotator/components/ToastMessages.tsx

 import { useCallback, useEffect, useState } from 'preact/hooks';
 
 import BaseToastMessages from '../../shared/components/BaseToastMessages';
+import type { ToastMessage } from '../../shared/components/BaseToastMessages';
 import type { PortRPC } from '../../shared/messaging';
-import type { ToastMessage } from '../../sidebar/store/modules/toast-messages';
 import type {
   HostToSidebarEvent,
   SidebarToHostEvent,

src/shared/components/BaseToastMessages.tsx

@@ -7,7 +7,14 @@ import {
 } from '@hypothesis/frontend-shared/lib/next';
 import classnames from 'classnames';
 
-import type { ToastMessage } from '../../sidebar/store/modules/toast-messages';
+export type ToastMessage = {
+  type: 'error' | 'success' | 'notice';
+  id: string;
+  message: string;
+  moreInfoURL: string;
+  isDismissed: boolean;
+  visuallyHidden: boolean;
+};
 
 type ToastMessageItemProps = {
   message: ToastMessage;
@@ -18,9 +25,6 @@ type ToastMessageItemProps = {
  * An individual toast message: a brief and transient success or error message.
  * The message may be dismissed by clicking on it. `visuallyHidden` toast
  * messages will not be visible but are still available to screen readers.
- *
- * Otherwise, the `toastMessenger` service handles removing messages after a
- * certain amount of time.
  */
 function ToastMessageItem({ message, onDismiss }: ToastMessageItemProps) {
   // Capitalize the message type for prepending; Don't prepend a message
@@ -98,7 +102,7 @@ function ToastMessageItem({ message, onDismiss }: ToastMessageItemProps) {
   );
 }
 
-export type ToastMessageProps = {
+export type BaseToastMessageProps = {
   messages: ToastMessage[];
   onMessageDismiss: (messageId: string) => void;
 };
@@ -110,7 +114,7 @@ export type ToastMessageProps = {
 export default function BaseToastMessages({
   messages,
   onMessageDismiss,
-}: ToastMessageProps) {
+}: BaseToastMessageProps) {
   // The `ul` containing any toast messages is absolute-positioned and the full
   // width of the viewport. Each toast message `li` has its position and width
   // constrained by `container` configuration in tailwind.

src/sidebar/components/ToastMessages.tsx

@@ -9,7 +9,7 @@ export type ToastMessageProps = {
 };
 
 /**
- * A component designed to render toast messages handled by the sidebar store.
+ * Component that renders the active toast messages from the sidebar store
  */
 function ToastMessages({ toastMessenger }: ToastMessageProps) {
   const store = useSidebarStore();

src/sidebar/services/frame-sync.ts

@@ -2,6 +2,7 @@ import debounce from 'lodash.debounce';
 import type { DebouncedFunction } from 'lodash.debounce';
 import shallowEqual from 'shallowequal';
 
+import type { ToastMessage } from '../../shared/components/BaseToastMessages';
 import { ListenerCollection } from '../../shared/listener-collection';
 import {
   PortFinder,
@@ -22,7 +23,6 @@ import { isReply, isPublic } from '../helpers/annotation-metadata';
 import { annotationMatchesSegment } from '../helpers/annotation-segment';
 import type { SidebarStore } from '../store';
 import type { Frame } from '../store/modules/frames';
-import type { ToastMessage } from '../store/modules/toast-messages';
 import { watch } from '../util/watch';
 import type { AnnotationsService } from './annotations';
 import type { ToastMessengerService } from './toast-messenger';

src/sidebar/store/modules/toast-messages.js

 import { createStoreModule, makeAction } from '../create-store';
 
 /**
- * @typedef ToastMessage
- * @prop {('error'|'success'|'notice')} type
- * @prop {string} id
- * @prop {string} message
- * @prop {string} moreInfoURL
- * @prop {boolean} isDismissed
- * @prop {boolean} visuallyHidden
+ * @typedef {import('../../../shared/components/BaseToastMessages').ToastMessage} ToastMessage
  */
 
 /**