Community projects (#1620)

* Community Projects

* Update website/src/docs/community-projects.md

* Update website/src/docs/lossless-optimize.md

* Update website/themes/uppy/layout/partials/docs_menu.ejs

* Added uppy-aws-amplify to community projects (#1666)

* Improve styles and layout of the plugin list

* Move image-optimize to community projects page for now

//cc @kvz

It’s not on npm yet, not transpiled to ES5, so very raw indeed

* Add React to list of plugins

* Mimic uppy.io/docs/plugins structure

* more compact padding

README.md

@@ -90,48 +90,57 @@ Alternatively, you can also use a pre-built bundle from Transloadit's CDN: Edgly
 ## Documentation
 
 - [Uppy](https://uppy.io/docs/uppy/) — full list of options, methods, and events.
-- [Plugins](https://uppy.io/docs/plugins/) — list of Uppy plugins and their options.
-- [Companion](https://uppy.io/docs/companion/) — setting up and running an Companion instance, which adds support for Instagram, Dropbox, Google Drive and remote urls.
-- [React](https://uppy.io/docs/react/) — components to integrate Uppy UI plugins with React apps.
-- [Architecture & Writing a Plugin](https://uppy.io/docs/writing-plugins/) — how to write a plugin for Uppy.
+- [Plugins](https://uppy.io/docs/plugins/) — list of Uppy plugins and their options
+- [Companion](https://uppy.io/docs/companion/) — setting up and running an Companion instance, which adds support for Instagram, Dropbox, Google Drive and remote urls
+- [React](https://uppy.io/docs/react/) — components to integrate Uppy UI plugins with React apps
+- [Architecture & Writing a Plugin](https://uppy.io/docs/writing-plugins/) — how to write a plugin for Uppy
 
 ## Plugins
 
-[List of plugins and their common options](https://uppy.io/docs/plugins/).
+[List of plugins and their common options](https://uppy.io/docs/plugins/)
 
-### Local Sources
+### UI Elements
+
+- [`Dashboard`](https://uppy.io/docs/dashboard/) — universal UI with previews, progress bars, metadata editor and all the cool stuff. Required for most UI plugins like Webcam and Instagram
+- [`Progress Bar`](https://uppy.io/docs/progress-bar/) — minimal progress bar that fills itself when upload progresses
+- [`Status Bar`](https://uppy.io/docs/status-bar/) — more detailed progress, pause/resume/cancel buttons, percentage, speed, uploaded/total sizes (included by default with `Dashboard`)
+- [`Informer`](https://uppy.io/docs/informer/) — send notifications like “smile” before taking a selfie or “upload failed” when all is lost (also included by default with `Dashboard`)
+
+### Sources
 
-- [`Dashboard`](https://uppy.io/docs/dashboard/) — universal UI with previews, progress bars, metadata editor and all the cool stuff
 - [`Drag & Drop`](https://uppy.io/docs/drag-drop/) — plain and simple drag and drop area
 - [`File Input`](https://uppy.io/docs/file-input/) — even plainer “select files” button
 - [`Webcam`](https://uppy.io/docs/webcam/) — snap and record those selfies 📷
+- ⓒ [`Google Drive`](https://uppy.io/docs/google-drive/)
+- ⓒ [`Dropbox`](https://uppy.io/docs/dropbox/)
+- ⓒ [`Instagram`](https://uppy.io/docs/instagram/)
+- ⓒ [`Import From URL`](https://uppy.io/docs/url/) — support picking files from remote providers or direct URLs from anywhere on the web
 
-### Remote Providers
+The ⓒ mark means that [`@uppy/companion`](https://uppy.io/docs/companion), a server-side component, is needed for a plugin to work.
 
-- [`Google Drive`](https://uppy.io/docs/google-drive/), [`Dropbox`](https://uppy.io/docs/dropbox/), [`Instagram`](https://uppy.io/docs/instagram/), [`Import From URL`](https://uppy.io/docs/url/) — support picking files from remote providers or direct URLs from anywhere on the web. Note that [`@uppy/companion`](https://uppy.io/docs/companion) is needed for these.
+### Destinations
 
-### Uploaders
-
-- [`Tus`](https://uppy.io/docs/tus/) — resumable uploads via the open [tus](http://tus.io) standard
-- [`XHR Upload`](https://uppy.io/docs/xhr-upload/) — regular uploads for any backend out there (like Apache, Nginx)
-- [`AWS S3`](https://uppy.io/docs/aws-s3/) and [`AWS S3 Multipart`](https://uppy.io/docs/aws-s3-multipart/) — upload to AWS S3.
-
-### UI Elements
-
-- [`Progress Bar`](https://uppy.io/docs/progress-bar/) — minimal progress bar that fills itself when upload progresses
-- [`Status Bar`](https://uppy.io/docs/status-bar/) — more detailed progress, pause/resume/cancel buttons, percentage, speed, uploaded/total sizes (included by default with `Dashboard`)
-- [`Informer`](https://uppy.io/docs/informer/) — send notifications like “smile” before taking a selfie or “upload failed” when all is lost (also included by default with `Dashboard`)
+- [`Tus`](https://uppy.io/docs/tus/) — resumable uploads via the open [tus](http://tus.io) standard.
+- [`XHR Upload`](https://uppy.io/docs/xhr-upload/) — regular uploads for any backend out there (like Apache, Nginx).
+- [`AWS S3`](https://uppy.io/docs/aws-s3/) — uploader for AWS S3.
+- [`AWS S3 Multipart`](https://uppy.io/docs/aws-s3-multipart/) — upload to AWS S3.
 
 ### File Processing
 
+- [`Robodog`](https://uppy.io/docs/robodog/) — user friendly abstraction to do file processing with Transloadit .
 - [`Transloadit`](https://uppy.io/docs/transloadit/) — support for [Transloadit](http://transloadit.com)’s robust file uploading and encoding backend
 
 ### Miscellaneous
 
-- [`Golden Retriever`](https://uppy.io/docs/golden-retriever/) — restores files after a browser crash, like it’s nothing
-- [`Thumbnail Generator`](https://uppy.io/docs/thumbnail-generator/) — generates image previews (included by default with `Dashboard`)
-- [`Form`](https://uppy.io/docs/form/) — collects metadata from `<form>` right before an Uppy upload, then optionally appends results back to the form
-- [`Redux`](https://uppy.io/docs/redux/) — for your emerging [time traveling](https://github.com/gaearon/redux-devtools) needs
+- [`Golden Retriever`](https://uppy.io/docs/golden-retriever/) — restores files after a browser crash, like it’s nothing.
+- [`Thumbnail Generator`](https://uppy.io/docs/thumbnail-generator/) — generates image previews (included by default with `Dashboard`).
+- [`Form`](https://uppy.io/docs/form/) — collects metadata from `<form>` right before an Uppy upload, then optionally appends results back to the form.
+- [`Redux`](https://uppy.io/docs/redux/) — for your emerging [time traveling](https://github.com/gaearon/redux-devtools) needs.
+
+## React
+
+- [React](https://uppy.io/docs/react/) — components to integrate Uppy UI plugins with React apps
+- [React Native](https://uppy.io//docs/react/native/) — basic Uppy component for React Native with Expo
 
 ## Browser Support
 

website/src/docs/aws-s3-multipart.md

@@ -5,6 +5,7 @@ title: "AWS S3 Multipart"
 module: "@uppy/aws-s3-multipart"
 permalink: docs/aws-s3-multipart/
 category: 'Destinations'
+tagline: uploader for AWS S3 using its resumable Multipart protocol
 ---
 
 The `@uppy/aws-s3-multipart` plugin can be used to upload files directly to an S3 bucket using S3's Multipart upload strategy. With this strategy, files are chopped up in parts of 5MB+ each, so they can be uploaded concurrently. It is also very reliable: if a single part fails to upload, only that 5MB chunk has to be retried.

website/src/docs/aws-s3.md

@@ -5,6 +5,7 @@ title: "AWS S3"
 module: "@uppy/aws-s3"
 permalink: docs/aws-s3/
 category: 'Destinations'
+tagline: uploader for AWS S3
 ---
 
 The `@uppy/aws-s3` plugin can be used to upload files directly to an S3 bucket.

website/src/docs/community-projects.md

@@ -0,0 +1,17 @@
+---
+type: docs
+order: 6
+title: "Community Projects"
+menu: "Community Projects"
+permalink: docs/community-projects/
+category: 'Docs'
+---
+
+Uppy has a large community of enthusiasts building plugins, integrations with js frameworks, etc! Here's a non-exhaustive list as we just started indexing these.
+
+- [vue-uppy](https://github.com/toast38coza/vue-uppy) — A Vue wrapper for Uppy.io
+- [ng-uppy](https://github.com/sunil-shrestha/ng-uppy) — Sample angular (5.x) app for uppy.io with resumable uploads
+- [uppy-aws-amplify](https://github.com/joelvh/uppy-aws-amplify) — Upload to AWS Amplify Storage (S3) with Uppy
+- [uppy-image-compressor](https://github.com/arturi/uppy-plugin-image-compressor/blob/master/src/index.js) — Uppy’s own [Artur Paikin](https://github.com/arturi) received a [question](https://github.com/transloadit/uppy/issues/1582#issuecomment-495787004) about creating plugins and wanted to showcase how you could for example, do image optimization before uploading with Uppy even starts. This could save bandwidth and time, at the tradeoff of not having the original version on the server. We thought the result might be useful to others too so this project is currently under consideration of becoming an official Plugin, depending on your feedback.
+
+We'd like to list more community projects, do you know one that should be on this page? Send us a PR via the link down below.

website/src/docs/companion.md

@@ -6,6 +6,7 @@ module: "@uppy/companion"
 permalink: docs/companion/
 alias: docs/server/
 category: 'Docs'
+tagline: Server-side proxy that enables remote sources like Instagram, Google Drive, S3
 ---
 
 > Companion was previously known as Uppy Server. It was renamed in v0.14.0.

website/src/docs/dashboard.md

@@ -5,6 +5,7 @@ title: "Dashboard"
 module: "@uppy/dashboard"
 permalink: docs/dashboard/
 category: 'UI Elements'
+tagline: full-featured sleek UI with file previews, metadata editing, upload/pause/resume/cancel buttons and more. Includes <code>StatusBar</code> and <code>Informer</code> plugins by default
 ---
 
 `@uppy/dashboard` is a universal UI plugin for Uppy, offering several useful features:

website/src/docs/dragdrop.md

@@ -6,6 +6,7 @@ module: "@uppy/drag-drop"
 permalink: docs/drag-drop/
 alias: docs/dragdrop/
 category: 'Sources'
+tagline: plain and simple drag-and-drop area
 ---
 
 The `@uppy/drag-drop` plugin renders a simple drag and drop area for file selection. it can be useful when you only want the local device as a file source, don’t need file previews and a UI for metadata editing, and the [Dashboard](/docs/dashboard/) feels like overkill.

website/src/docs/dropbox.md

@@ -6,6 +6,7 @@ menu_prefix: "<span title='Requires Companion'>ⓒ </span>"
 module: "@uppy/dropbox"
 permalink: docs/dropbox/
 category: 'Sources'
+tagline: import files from Dropbox
 ---
 
 The `@uppy/dropbox` plugin lets users import files from their Dropbox account.

website/src/docs/fileinput.md

@@ -6,6 +6,7 @@ module: "@uppy/file-input"
 permalink: docs/file-input/
 alias: docs/fileinput/
 category: 'Sources'
+tagline: even more plain and simple, just a button
 ---
 
 `@uppy/file-input` is the most barebones UI for selecting files — it shows a single button that, when clicked, opens up the browser's file selector.

website/src/docs/form.md

@@ -5,6 +5,7 @@ title: "Form"
 module: "@uppy/form"
 permalink: docs/form/
 category: 'Miscellaneous'
+tagline: collect metadata from <code>&lt;form&gt;</code> right before the Uppy upload, then optionally append results back to the form
 ---
 
 The `@uppy/form` plugin has several features to integrate with HTML `<form>` elements.

website/src/docs/golden-retriever.md

@@ -5,6 +5,7 @@ type: docs
 permalink: docs/golden-retriever/
 order: 1
 category: 'Miscellaneous'
+tagline: restore files and continue uploading after a page refresh or a browser crash
 ---
 
 The `@uppy/golden-retriever` plugin saves selected files in your browser cache, so that if the browser crashes, Uppy can restore everything and continue uploading as if nothing happened. You can read more about it [on our blog](https://uppy.io/blog/2017/07/golden-retriever/).

website/src/docs/google-drive.md

@@ -6,6 +6,7 @@ menu_prefix: "<span title='Requires Companion'>ⓒ </span>"
 module: "@uppy/google-drive"
 permalink: docs/google-drive/
 category: 'Sources'
+tagline: import files from Google Drive
 ---
 
 The `@uppy/google-drive` plugin lets users import files from their Google Drive account.

website/src/docs/informer.md

@@ -5,6 +5,7 @@ title: "Informer"
 module: "@uppy/informer"
 permalink: docs/informer/
 category: 'UI Elements'
+tagline: show notifications
 ---
 
 The `@uppy/informer` plugin is a pop-up bar for showing notifications. When plugins have some exciting news (or error) to share, they can show a notification here.

website/src/docs/instagram.md

@@ -6,6 +6,7 @@ menu_prefix: "<span title='Requires Companion'>ⓒ </span>"
 module: "@uppy/instagram"
 permalink: docs/instagram/
 category: 'Sources'
+tagline: import files from Instagram
 ---
 
 The `@uppy/instagram` plugin lets users import files from their Instagram account.

website/src/docs/plugins.md

@@ -1,35 +1,12 @@
 ---
 title: "List of Plugins"
 type: docs
+subtype: plugin-list
+body_class: page-plugin-list
+filter_modules: true
 permalink: docs/plugins/
 order: 3
 category: 'Docs'
 ---
 
-Plugins are what makes Uppy useful: they help select, manipulate and upload files.
-
-- **Local Sources:**
-  - [@uppy/dashboard](/docs/dashboard) — full-featured sleek UI with file previews, metadata editing, upload/pause/resume/cancel buttons and more. Includes `StatusBar` and `Informer` plugins by default
-  - [@uppy/drag-drop](/docs/drag-drop) — plain and simple drag-and-drop area
-  - [@uppy/file-input](/docs/file-input) — even more plain and simple, just a button
-  - [@uppy/webcam](/docs/webcam) — upload selfies or audio / video recordings
-- **[Remote Providers](/docs/providers):** (remote sources that work through [Companion](/docs/companion/))
-  - [@uppy/dropbox](/docs/dropbox) – import files from Dropbox
-  - [@uppy/google-drive](/docs/google-drive) – import files from Google Drive
-  - [@uppy/instagram](/docs/instagram) – import files from Instagram
-  - [@uppy/url](/docs/url) – import files from any public URL
-- **Uploaders:**
-  - [@uppy/tus](/docs/tus) — uploads using the [tus](https://tus.io) resumable upload protocol
-  - [@uppy/xhr-upload](/docs/xhr-upload) — classic multipart form uploads or binary uploads using XMLHTTPRequest
-  - [@uppy/aws-s3](/docs/aws-s3) — uploader for AWS S3
-  - [@uppy/aws-s3-multipart](/docs/aws-s3-multipart) — uploader for AWS S3 using its resumable Multipart protocol
-- **UI Elements:**
-  - [@uppy/progress-bar](/docs/progress-bar) — add a small YouTube-style progress bar at the top of the page
-  - [@uppy/status-bar](/docs/status-bar) — advanced upload progress status bar
-  - [@uppy/informer](/docs/informer) — show notifications
-- **Encoding Services:**
-  - [@uppy/transloadit](/docs/transloadit) — manipulate and transcode uploaded files using the [transloadit.com](https://transloadit.com) service
-- **Miscellaneous:**
-  - [@uppy/form](/docs/form) — collect metadata from `<form>` right before the Uppy upload, then optionally append results back to the form
-  - [@uppy/thumbnail-generator](/docs/thumbnail-generator) — generate preview thumbnails for images to be uploaded
-  - [@uppy/golden-retriever](/docs/golden-retriever) — restore files and continue uploading after a page refresh or a browser crash
+Everyhing in Uppy is a Plugin. This let's us offer a wealth of features, while also allowing for small bundle sizes, if you only need a few.

website/src/docs/progressbar.md

@@ -6,6 +6,7 @@ module: "@uppy/progress-bar"
 permalink: docs/progress-bar/
 alias: docs/progressbar/
 category: 'UI Elements'
+tagline: add a small YouTube-style progress bar at the top of the page
 ---
 
 `@uppy/progress-bar` is a minimalist plugin that shows the current upload progress in a thin bar element, similar to the ones used by YouTube and GitHub when navigating between pages.

website/src/docs/react-dashboard-modal.md

@@ -1,6 +1,7 @@
 ---
 title: "<DashboardModal />"
 type: docs
+module: "@uppy/react"
 permalink: docs/react/dashboard-modal/
 order: 5
 category: 'React'

website/src/docs/react-dashboard.md

@@ -1,6 +1,7 @@
 ---
 title: "<Dashboard />"
 type: docs
+module: "@uppy/react"
 permalink: docs/react/dashboard/
 order: 4
 category: 'React'

website/src/docs/react-dragdrop.md

@@ -1,6 +1,7 @@
 ---
 title: "<DragDrop />"
 type: docs
+module: "@uppy/react"
 permalink: docs/react/drag-drop/
 alias: docs/react/dragdrop/
 order: 2

website/src/docs/react-native.md

@@ -1,6 +1,7 @@
 ---
 title: "React Native"
 type: docs
+module: "@uppy/react-native"
 permalink: docs/react/native/
 order: 7
 category: 'React'

website/src/docs/react-progressbar.md

@@ -1,6 +1,7 @@
 ---
 title: "<ProgressBar />"
 type: docs
+module: "@uppy/react"
 permalink: docs/react/progress-bar/
 alias: docs/react/progressbar/
 order: 3

website/src/docs/react-statusbar.md

@@ -1,6 +1,7 @@
 ---
 title: "<StatusBar />"
 type: docs
+module: "@uppy/react"
 permalink: docs/react/status-bar/
 alias: docs/react/statusbar/
 order: 1

website/src/docs/react.md

@@ -1,6 +1,7 @@
 ---
 title: "Introduction"
 type: docs
+module: "@uppy/react"
 permalink: docs/react/
 order: 0
 category: 'React'

website/src/docs/redux.md

@@ -1,9 +1,11 @@
 ---
 title: "Redux"
 type: docs
+module: "@uppy/store-redux"
 permalink: docs/redux/
 order: 9
-category: 'React'
+category: 'Miscellaneous'
+tagline: Uppy can use your app’s Redux store for its files and UI state
 ---
 
 Uppy supports the popular [Redux](https://redux.js.org/) state management library in two ways:

website/src/docs/robodog.md

@@ -6,6 +6,7 @@ menu: "Robodog Introduction"
 module: "@uppy/robodog"
 permalink: docs/robodog/
 category: 'File Processing'
+tagline: user friendly abstraction to do file processing with Transloadit
 ---
 
 [Transloadit][transloadit] is a service that helps you handle file uploads, resize, crop and watermark your images, make GIFs, transcode your videos, extract thumbnails, generate audio waveforms, and so much more. In short, [Transloadit][transloadit] is the Swiss Army Knife for your files.

website/src/docs/statusbar.md

@@ -6,6 +6,7 @@ module: "@uppy/status-bar"
 permalink: docs/status-bar/
 alias: docs/statusbar/
 category: 'UI Elements'
+tagline: advanced upload progress status bar
 ---
 
 The `@uppy/status-bar` plugin shows upload progress and speed, ETAs, pre- and post-processing information, and allows users to control (pause/resume/cancel) the upload.

website/src/docs/thumbnail-generator.md

@@ -5,6 +5,7 @@ title: "Thumbnail Generator"
 module: "@uppy/thumbnail-generator"
 permalink: docs/thumbnail-generator/
 category: 'Miscellaneous'
+tagline: generate preview thumbnails for images to be uploaded
 ---
 
 `@uppy/thumbnail-generator` generates proportional thumbnails (file previews) for images that are added to Uppy.

website/src/docs/transloadit.md

@@ -5,6 +5,7 @@ title: "Transloadit"
 module: "@uppy/transloadit"
 permalink: docs/transloadit/
 category: 'File Processing'
+tagline: manipulate and transcode uploaded files using the <a href="https://transloadit.com">transloadit.com</a> service
 ---
 
 The `@uppy/transloadit` plugin can be used to upload files to [Transloadit](https://transloadit.com/) for all kinds of processing, such as transcoding video, resizing images, zipping/unzipping, [and much more](https://transloadit.com/services/).

website/src/docs/tus.md

@@ -5,6 +5,7 @@ title: "Tus"
 module: "@uppy/tus"
 permalink: docs/tus/
 category: 'Destinations'
+tagline: uploads using the <a href="https://tus.io">tus</a> resumable upload protocol
 ---
 
 The `@uppy/tus` plugin brings resumable file uploading by [tus.io](http://tus.io) to Uppy by wrapping the [tus-js-client][].

website/src/docs/uppy.md

@@ -5,6 +5,7 @@ title: "Uppy"
 module: "@uppy/core"
 permalink: docs/uppy/
 category: 'Docs'
+tagline: The core module that orchestrates everything
 ---
 
 This is the core module that orchestrates everything in Uppy, managing state and events and providing methods.

website/src/docs/url.md

@@ -6,6 +6,7 @@ menu_prefix: "<span title='Requires Companion'>ⓒ </span>"
 module: "@uppy/url"
 permalink: docs/url/
 category: 'Sources'
+tagline: import files from any public URL
 ---
 
 The `@uppy/url` plugin allows users to import files from the internet. Paste any URL and it will be added!

website/src/docs/webcam.md

@@ -5,6 +5,7 @@ title: "Webcam"
 module: "@uppy/webcam"
 permalink: docs/webcam/
 category: 'Sources'
+tagline: upload selfies or audio / video recordings
 ---
 
 The `@uppy/webcam` plugin lets you take photos and record videos with a built-in camera on desktop and mobile devices.

website/src/docs/xhrupload.md

@@ -7,6 +7,7 @@ module: "@uppy/xhr-upload"
 permalink: docs/xhr-upload/
 alias: docs/xhrupload/
 category: 'Destinations'
+tagline: classic multipart form uploads or binary uploads using XMLHTTPRequest
 ---
 
 The `@uppy/xhr-upload` plugin handles classic HTML multipart form uploads, as well as uploads using the HTTP `PUT` method.

website/themes/uppy/layout/page.ejs

@@ -1,9 +1,14 @@
 <% if (page.type && page.type !== 'page') { %>
-    <%- partial('partials/sidebar', { type: page.type, index: page.index }) %>
+    <%- partial('partials/sidebar', { only_modules: false, add_taglines: false, type: page.type, index: page.index }) %>
 <% } %>
 <div class="Content js-Content <%- page.type ? page.type + ' with-sidebar' : '' %>">
     <h1><%- page.title %></h1>
     <%- page.content %>
+    
+    <% if (page.subtype === 'plugin-list') { %>
+      <%- partial('partials/docs_menu', { only_modules: true, add_taglines: true, type: page.type, index: page.index }) %>
+    <% } %>    
+
     <% if (page.type === 'guide') { %>
       <div class="guide-links">
         <% site.pages.find({ type: page.type, order: page.order - 1 }).each(function (page) { %>

website/themes/uppy/layout/partials/docs_menu.ejs

@@ -0,0 +1,68 @@
+<%
+  var categories = []
+
+  if (page.type === 'docs') {
+    categories = [
+      { category: 'Docs', path: 'docs/', link: true, hidden: true },
+      { category: 'UI Elements', path: 'docs/dashboard/', link: false },
+      { category: 'Sources', path: 'docs/drag-drop/', link: false, tagline: '(remote sources are denoted with (c) and require <a href="/docs/companion/">Companion</a>' },
+      { category: 'Destinations', path: 'docs/tus/', link: false },
+      { category: 'File Processing', path: 'docs/robodog/', link: true },
+      { category: 'Miscellaneous', path: 'docs/form/', link: false },
+      { category: 'Community Projects', path: 'docs/community-projects/', link: true },
+      { category: 'React', path: 'docs/react/', link: true },
+      { category: 'Contributing', path: 'docs/contributing/', link: true },
+      ]
+    } else if (page.type === 'examples') {
+      categories = [
+      { category: 'Examples', path: 'examples/', link: true, hidden: true },
+      { category: 'File Processing', path: 'examples/markdown-snippets/', link: true },
+    ]
+  } else {
+    categories = [
+      { category: 'Unknown Type: ' + page.type, path: 'unknown/unknown/', link: false },
+    ]
+  }
+
+  var catPages = {}
+  site.pages.find({ type }).each((p) => {
+    if (only_modules === true) {
+      if (!p.module) {
+        return;
+      }
+    }
+
+    if (!p.title && !p.menu) {
+      return;
+    }
+    if (!p.path|| p.path === 'undefined') {
+      return;
+    }
+
+    var path = (p.path || '').replace(/index\.html$/, '');
+    catPages[p.category] = catPages[p.category] || [];
+    catPages[p.category].push(p);
+  })
+%>
+<% for (var i in categories) { %>
+    <% var sorted = (catPages[categories[i].category] || []).sort((a, b) => {return a.order - b.order}) %>
+    <% if (!categories[i].hidden && sorted.length) { %>
+        <% if (categories[i].link && add_taglines === false) { %>
+        <h3 key="<%-'category-' + i + '-' + categories[i].category %>" data-scroll="no"><a href="/<%- categories[i].path %>"><%- categories[i].category %></a></h3>
+        <% } else { %>
+        <h3 key="<%-'category-' + i + '-' + categories[i].category %>" data-scroll="no"><%- categories[i].category %></h3>
+        <% } %>
+    <% } %>
+    <ul>
+      <% sorted.forEach((p, j) => { %>
+        <% var path = (p.path || '').replace(/index\.html$/, ''); %>
+        <% var firstInCategory = categories.find((c) => c.path === path) %>
+        <li key="<%-'p-' + j + '-' + p.path %>">
+          <%- p.menu_prefix %><a href="/<%- path %>" class="sidebar-link<%- page.title === p.title ? ' current' : '' %>"><%- add_taglines === true ? p.title : p.menu || p.title %></a>
+          <% if (add_taglines === true && p.tagline) { %>
+            <%- ' — ' + p.tagline %>
+          <%}%>
+        </li>
+      <% }) %>
+    </ul>
+<% } %>

website/themes/uppy/layout/partials/sidebar.ejs

@@ -1,35 +1,3 @@
-<%
-var categories = []
-
-if (page.type === 'docs') {
-  categories = [
-    { category: 'Docs', path: 'docs/', link: true, hidden: true },
-    { category: 'UI Elements', path: 'docs/dashboard/', link: false },
-    { category: 'Sources', path: 'docs/drag-drop/', link: false },
-    { category: 'Destinations', path: 'docs/tus/', link: false },
-    { category: 'File Processing', path: 'docs/robodog/', link: true },
-    { category: 'Miscellaneous', path: 'docs/form/', link: false },
-    { category: 'React', path: 'docs/react/', link: true },
-    { category: 'Contributing', path: 'docs/contributing/', link: true },
-    ]
-  } else if (page.type === 'examples') {
-    categories = [
-    { category: 'Examples', path: 'examples/', link: true, hidden: true },
-    { category: 'File Processing', path: 'examples/markdown-snippets/', link: true },
-  ]
-} else {
-  categories = [
-    { category: 'Unknown Type: ' + page.type, path: 'unknown/unknown/', link: false },
-  ]
-}
-
-var catPages = {}
-site.pages.find({ type }).each((p) => {
-  var path = (p.path || '').replace(/index\.html$/, '');
-  catPages[p.category] = catPages[p.category] || [];
-  catPages[p.category].push(p);
-})
-%>
 <div class="Sidebar js-Sidebar">
   <ul class="main-menu">
     <%- partial('partials/main_menu') %>
@@ -38,31 +6,12 @@ site.pages.find({ type }).each((p) => {
     <h2>
       <% if (page.type) { %>
         <a href="/<%- type %>"><%- type === 'api' ? 'API' : (type.charAt(0).toUpperCase() + type.slice(1)) %></a>
-      <% } %>
-    </h2>
-
-    <ul class="menu-root">
-      <% for (var i in categories) { %>
-        <% var sorted = (catPages[categories[i].category] || ['No catPages for: ' + i]).sort((a, b) => {return a.order - b.order}) %>
-        <% if (!categories[i].hidden) { %>
-          <li>
-            <% if (categories[i].link) { %>
-            <h3><a href="/<%- categories[i].path %>"><%- categories[i].category %></a></h3>
-            <% } else { %>
-            <h3><%- categories[i].category %></h3>
-            <% } %>
-          </li>
         <% } %>
-        <% sorted.forEach((p) => { %>
-          <% var path = (p.path || '').replace(/index\.html$/, ''); %>
-          <% var firstInCategory = categories.find((c) => c.path === path) %>
-          <% // see https://github.com/vuejs/vuejs.org/blob/master/themes/vue/layout/partials/toc.ejs %>
-          <li>
-            <%- p.menu_prefix %><a href="/<%- path %>" class="sidebar-link<%- page.title === p.title ? ' current' : '' %>"><%- p.menu || p.title %></a>
-          </li>
-        <% }) %>
-      <% } %>
-    </ul>
+      </h2>
+      
+    <div class="menu-root">
+      <%- partial('partials/docs_menu') %>
+    </div>
     <%- partial('partials/social') %>
   </div>
 </div>

website/themes/uppy/source/css/_page.scss

@@ -61,6 +61,11 @@
     padding-left: 1em;
   }
 
+  .menu-root > ul {
+    margin: 0;
+    padding-left: 0;
+  }
+
   &.is-blog ul { padding-left: 0; }
 
   li {
@@ -279,7 +284,8 @@
   .post li,
   > ul li,
   > li {
-    margin-bottom: 0.5em;
+    // @TODO can this safely be removed artur?
+    // margin-bottom: 0.5em;
   }
 
   .post p, .post ul, .post ol,
@@ -358,7 +364,21 @@
   white-space: nowrap;
   font-size: 90%;
 }
-.page-docs-locales table code {
+
+// Plugin list
+
+body.page-plugin-list .Content ul {
+  margin-left: 0;
+}
+
+body.page-plugin-list .Content li {
+  // list-style: none;
+  margin-bottom: 0.5em;
+}
+
+// Locales
+
+body.page-docs-locales table code {
   font-size: 75%;
 }
 

website/themes/uppy/source/js/common.js

@@ -102,6 +102,9 @@
     }
 
     function makeLinkClickable (link) {
+      if (link.getAttribute('data-scroll') === 'no') {
+        return
+      }
       var wrapper = document.createElement('a')
       wrapper.href = '#' + link.id
       wrapper.setAttribute('data-scroll', '')