fix error reset

src/App.scss

@@ -18,28 +18,26 @@
   }
 }
 
-@media print, screen and (min-width: 769px) {
-  .tile:not(.is-child) {
-      display: flex;
-  }
-}
-
-.tile.is-ancestor:last-child {
-  margin-bottom: -.75rem;
-}
-
-.tile.is-ancestor {
-  margin-left: -.75rem;
-  margin-right: -.75rem;
-  margin-top: -.75rem;
-}
-
 .tile {
   align-items: stretch;
   min-height: min-content;
-  flex-basis: 0;
-  flex-grow: 1;
-  flex-shrink: 1;
+  flex: 1 1 0;
+
+  &.is-ancestor {
+    margin-left: -0.75rem;
+    margin-right: -0.75rem;
+    margin-top: -0.75rem;
+
+    &:last-child {
+      margin-bottom: -0.75rem;
+    }
+  }
+
+  @media print, screen and (min-width: 769px) {
+    &:not(.is-child) {
+      display: flex;
+    }
+  }
 }
 
 .message-body {
@@ -51,4 +49,4 @@
   margin: 0 auto;
   position: relative;
   width: auto;
-}
+}

src/App.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/indent */
 import 'bulma/css/bulma.css';
 import '@fortawesome/fontawesome-free/css/all.css';
 import cn from 'classnames';

src/hooks/useComments.ts

@@ -9,6 +9,7 @@ export const useComments = (selectedPostId: number) => {
   const [isLoading, setIsLoading] = useState(false);
 
   const loadComments = () => {
+    setErrorMessage('');
     setIsLoading(true);
 
     commentsService

src/hooks/usePosts.ts

@@ -13,6 +13,8 @@ export const usePosts = (selectedUserId: number = 0) => {
       return;
     }
 
+    setErrorMessage('');
+
     postsService
       .getUserPosts(selectedUserId)
       .then(setPosts)

src/hooks/useUsers.ts

@@ -8,6 +8,8 @@ export const useUsers = () => {
   const [errorMessage, setErrorMessage] = useState('');
 
   const loadUsers = () => {
+    setErrorMessage('');
+
     usersService
       .getUsers()
       .then(res => {