diff --git a/components/PackageReadMePlaceholder.tsx b/components/PackageReadMePlaceholder.tsx new file mode 100644 index 0000000..46ade4b --- /dev/null +++ b/components/PackageReadMePlaceholder.tsx @@ -0,0 +1,51 @@ +import Html from './Html'; + +type Props = { + packageName: string, + version: string, + title: string, + description: string +} + +export default function PackageReadMePlaceholder(data: Props) { + const { + packageName, + version, + title, + description + } = data; + + return ( +
+
+
+
+

+ {`${packageName} (version ${version})`} +

+
+ { + title + && + ( +
+

{title}

+
+ ) + } + { + description + && + ( +
+

Description

+ {description} +
+ ) + } +
+
+
+ ); +} diff --git a/pages/packages/[package]/versions/[version].tsx b/pages/packages/[package]/versions/[version].tsx index 7988b0d..0c3d1f3 100644 --- a/pages/packages/[package]/versions/[version].tsx +++ b/pages/packages/[package]/versions/[version].tsx @@ -5,6 +5,7 @@ import Link from 'next/link'; import Layout from '../../../../components/Layout'; import PackageFunctionList from '../../../../components/PackageFunctionList'; import PackageReadme from '../../../../components/PackageReadme'; +import PackageReadMePlaceholder from '../../../../components/PackageReadMePlaceholder'; import PackageSidebar from '../../../../components/PackageSidebar'; import { getMonthlyDownloads } from '../../../../lib/downloads'; import { @@ -112,7 +113,18 @@ export default function PackageVersionPage({ )} + { + metadata.readmemd + ? + : + + }