Fix translations link (#2477)

This PR fixes a bug in the docs!

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

apps/docs/.gitignore

@@ -2,4 +2,5 @@ content/gen
 api-content.json
 content.db
 .env
-.next
+.next
+.vercel

apps/docs/app/layout.tsx

@@ -1,4 +1,5 @@
 import { Footer } from '@/components/Footer'
+import { Analytics } from '@vercel/analytics/react'
 import { Metadata, Viewport } from 'next'
 import AutoRefresh from '../components/AutoRefresh'
 import '../styles/globals.css'
@@ -74,13 +75,9 @@ export default async function RootLayout({ children }: { children: React.ReactNo
 							<div className="layout">{children}</div>
 							<Footer />
 						</div>
+						<Analytics />
 					</Providers>
 				</body>
-				<script
-					async
-					src="https://tag.clearbitscripts.com/v1/pk_98af4b0c7c25466da0035c32bc6789bd/tags.js"
-					referrerPolicy="strict-origin-when-cross-origin"
-				/>
 			</html>
 		</AutoRefresh>
 	)

apps/docs/components/ArticleDetails.tsx

@@ -0,0 +1,31 @@
+import { Article } from '@/types/content-types'
+import { Icon } from './Icon'
+
+type ArticleDetailsProps = {
+	article: Article
+}
+
+const ROOT_CONTENT_URL = `https://github.com/tldraw/tldraw/blob/main/apps/docs/content/`
+
+export function ArticleDetails({ article: { sourceUrl, date } }: ArticleDetailsProps) {
+	return (
+		<div className="article__details">
+			{sourceUrl && (
+				<a className="article__details__edit" href={`${ROOT_CONTENT_URL}${sourceUrl}`}>
+					<Icon icon="edit" />
+					<span>Edit this page</span>
+				</a>
+			)}
+			{date && (
+				<div className="article__details__timestamp">
+					Last edited on{' '}
+					{Intl.DateTimeFormat('en-gb', {
+						year: 'numeric',
+						month: 'long',
+						day: 'numeric',
+					}).format(new Date(date))}
+				</div>
+			)}
+		</div>
+	)
+}

apps/docs/components/ArticleDocsPage.tsx

@@ -1,5 +1,6 @@
 import { Article } from '@/types/content-types'
 import { getDb } from '@/utils/ContentDatabase'
+import { ArticleDetails } from './ArticleDetails'
 import { ArticleNavLinks } from './ArticleNavLinks'
 import { Breadcrumb } from './Breadcrumb'
 import { Header } from './Header'
@@ -20,17 +21,20 @@ export async function ArticleDocsPage({ article }: { article: Article }) {
 		articleId: article.id,
 	})
 
+	const isGenerated = article.sectionId === 'gen'
+
 	return (
 		<>
 			<Header activeId={article.id} />
 			<Sidebar {...sidebar} />
-			<main className={`article${section.id === 'gen' ? ' article__api-docs' : ''}`}>
+			<main className={`article${isGenerated ? ' article__api-docs' : ''}`}>
 				<div className="page-header">
 					<Breadcrumb section={section} category={category} />
 					<h1>{article.title}</h1>
 				</div>
 				{article.hero && <Image alt="hero" title={article.title} src={`images/${article.hero}`} />}
 				{article.content && <Mdx content={article.content} />}
+				{isGenerated ? null : <ArticleDetails article={article} />}
 				{links && <ArticleNavLinks links={links} />}
 			</main>
 			{headings.length > 0 ? <HeadingLinks article={article} headingLinks={headings} /> : null}

apps/docs/content/community/contributing.mdx

@@ -10,4 +10,4 @@ Interested in contributing to the project?
 
 You can find tldraw's source code on GitHub at [github.com/tldraw/tldraw](https://github.com/tldraw/tldraw). See our [Contributing guide](https://github.com/tldraw/tldraw/blob/main/CONTRIBUTING.md) for more information.
 
-To contribute translations to the project, please see our [translations guide](/translations).
+To contribute translations to the project, please see our [translations guide](/community/translations).

apps/docs/content/getting-started/installation.mdx

@@ -10,7 +10,7 @@ At the moment the `@tldraw/tldraw` package is in beta. We also ship a canary ver
 
 ## Beta
 
-First, install the `@tldraw/tldraw` package using `@beta` for the latest alpha release.
+First, install the `@tldraw/tldraw` package using `@beta` for the latest beta release.
 
 ```bash
 yarn add @tldraw/tldraw@beta

apps/docs/styles/globals.css

@@ -222,7 +222,7 @@ body {
 .article__details {
 	display: flex;
 	align-items: flex-start;
-	justify-content: flex-end;
+	justify-content: space-between;
 	margin: 40px 0px;
 	gap: 16px;
 	max-width: 100%;