Got to instance them all

src/pages/bookmarks.jsx

@@ -8,7 +8,7 @@ const LIMIT = 20;
 
 function Bookmarks() {
   useTitle('Bookmarks', '/b');
-  const { masto } = api();
+  const { masto, instance } = api();
   const bookmarksIterator = useRef();
   async function fetchBookmarks(firstLoad) {
     if (firstLoad || !bookmarksIterator.current) {
@@ -23,6 +23,7 @@ function Bookmarks() {
       id="bookmarks"
       emptyText="No bookmarks yet. Go bookmark something!"
       errorText="Unable to load bookmarks"
+      instance={instance}
       fetchItems={fetchBookmarks}
     />
   );

src/pages/favourites.jsx

@@ -8,7 +8,7 @@ const LIMIT = 20;
 
 function Favourites() {
   useTitle('Favourites', '/f');
-  const { masto } = api();
+  const { masto, instance } = api();
   const favouritesIterator = useRef();
   async function fetchFavourites(firstLoad) {
     if (firstLoad || !favouritesIterator.current) {
@@ -23,6 +23,7 @@ function Favourites() {
       id="favourites"
       emptyText="No favourites yet. Go favourite something!"
       errorText="Unable to load favourites"
+      instance={instance}
       fetchItems={fetchFavourites}
     />
   );

src/pages/following.jsx

@@ -113,6 +113,7 @@ function Following({ title, path, id, ...props }) {
       id={id || 'following'}
       emptyText="Nothing to see here."
       errorText="Unable to load posts."
+      instance={instance}
       fetchItems={fetchHome}
       checkForUpdates={checkForUpdates}
       useItemID

src/pages/list.jsx

@@ -10,7 +10,7 @@ import useTitle from '../utils/useTitle';
 const LIMIT = 20;
 
 function List(props) {
-  const { masto } = api();
+  const { masto, instance } = api();
   const id = props?.id || useParams()?.id;
   const latestItem = useRef();
 
@@ -66,6 +66,7 @@ function List(props) {
       id="list"
       emptyText="Nothing yet."
       errorText="Unable to load posts."
+      instance={instance}
       fetchItems={fetchList}
       checkForUpdates={checkForUpdates}
       boostsCarousel

src/pages/notifications.jsx

@@ -50,7 +50,7 @@ const LIMIT = 30; // 30 is the maximum limit :(
 
 function Notifications() {
   useTitle('Notifications', '/notifications');
-  const { masto } = api();
+  const { masto, instance } = api();
   const snapStates = useSnapshot(states);
   const [uiState, setUIState] = useState('default');
   const [showMore, setShowMore] = useState(false);
@@ -227,6 +227,7 @@ function Notifications() {
                 <>
                   {differentDay && <h2 class="timeline-header">{heading}</h2>}
                   <Notification
+                    instance={instance}
                     notification={notification}
                     key={notification.id}
                   />
@@ -279,7 +280,7 @@ function Notifications() {
     </div>
   );
 }
-function Notification({ notification }) {
+function Notification({ notification, instance }) {
   const { id, type, status, account, _accounts } = notification;
 
   // status = Attached when type of the notification is favourite, reblog, status, mention, poll, or update
@@ -392,7 +393,11 @@ function Notification({ notification }) {
         {status && (
           <Link
             class={`status-link status-type-${type}`}
-            to={`/s/${actualStatusID}`}
+            to={
+              instance
+                ? `/${instance}/s/${actualStatusID}`
+                : `/s/${actualStatusID}`
+            }
           >
             <Status status={status} size="s" />
           </Link>
@@ -403,6 +408,7 @@ function Notification({ notification }) {
 }
 
 function FollowRequestButtons({ accountID, onChange }) {
+  const { masto } = api();
   const [uiState, setUIState] = useState('default');
   return (
     <p>