chore: Loading placeholders (#2322)

* Improve visual of loading mask

* Normalize placeholder naming

* Remove unused file

app/scenes/Document/components/Document.js

@@ -18,10 +18,10 @@ import Branding from "components/Branding";
 import ErrorBoundary from "components/ErrorBoundary";
 import Flex from "components/Flex";
 import LoadingIndicator from "components/LoadingIndicator";
-import LoadingPlaceholder from "components/LoadingPlaceholder";
 import Modal from "components/Modal";
 import Notice from "components/Notice";
 import PageTitle from "components/PageTitle";
+import PlaceholderDocument from "components/PlaceholderDocument";
 import Time from "components/Time";
 import Container from "./Container";
 import Contents from "./Contents";
@@ -410,7 +410,7 @@ class DocumentScene extends React.Component<Props> {
                   )}
                 </Notice>
               )}
-              <React.Suspense fallback={<LoadingPlaceholder />}>
+              <React.Suspense fallback={<PlaceholderDocument />}>
                 <Flex auto={!readOnly}>
                   {showContents && <Contents headings={headings} />}
                   <Editor

app/scenes/Document/components/Loading.js

@@ -2,8 +2,8 @@
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import CenteredContent from "components/CenteredContent";
-import LoadingPlaceholder from "components/LoadingPlaceholder";
 import PageTitle from "components/PageTitle";
+import PlaceholderDocument from "components/PlaceholderDocument";
 import Container from "./Container";
 import type { LocationWithState } from "types";
 
@@ -20,7 +20,7 @@ export default function Loading({ location }: Props) {
         title={location.state ? location.state.title : t("Untitled")}
       />
       <CenteredContent>
-        <LoadingPlaceholder />
+        <PlaceholderDocument />
       </CenteredContent>
     </Container>
   );