Display a message to the user when a conflict due to optimistic locking occurs.
import { ConflictDetectionBanner } from '@folio/stripes/components';
// in component's body
const conflictDetectionBannerRef = useRef(null);
// handler for focusing the banner
const focusConflictDetectionBanner = () => {
conflictDetectionBannerRef.current.focus();
};
// ...in JSX...
<ConflictDetectionBanner
latestVersionLink="path/to/the/view/record/page"
conflictDetectionBannerRef={conflictDetectionBannerRef}
focusConflictDetectionBanner={focusConflictDetectionBanner}
/>
Name | Type | Description | Required |
---|---|---|---|
latestVersionLink | string | Path to the View page of the record being edited | ✔ |
conflictDetectionBannerRef | ref |
Reference to DOM element that should be focused when focusConflictDetectionBanner is called | ✔ |
focusConflictDetectionBanner | func | Used to focus the component | ✔ |