DX-2837 Add Documentation for New LTS Process (#741)

* DX-2837 Add Documentation for New LTS Process

* convert to react component for easier updating

* update version

* update test

* add keyword

* update action version

* Apply suggestions from code review

Co-authored-by: Brian <[email protected]>

* Update site/docs/versions.mdx

Co-authored-by: dyeam-bw <[email protected]>

Co-authored-by: Brian <[email protected]>
Co-authored-by: dyeam-bw <[email protected]>

Author: 3 people

.github/workflows/lts-release.yml

@@ -48,7 +48,7 @@ jobs:
           BUCKET_NAME: ${{ needs.lts_needed.outputs.release_name }}
 
       - name: Sync to S3
-        uses: Bandwidth/s3-sync-action@v1.2.0
+        uses: Bandwidth/s3-sync-action@v1.3.0
         with:
           bucket-name: ${{ steps.bucket_name.outputs.bucket_name }}
           bucket-expiration: '180'

site/cypress/e2e/tests/docs.cy.js

@@ -28,8 +28,8 @@ context('Emergency Services Link', () => {
   testTextLink('/docs','Emergency Services', 'docs/emergency' ,'.docs-intro-grid-item')
 })
 
-context('Next - About Link', () => {
-  testTextLink('/docs','About', 'docs/account' ,'a.pagination-nav__link')
+context('Next - Versions Link', () => {
+  testTextLink('/docs','Versions', 'docs/versions' ,'a.pagination-nav__link')
 })
 
 context('Edit This Page Link', () => {

site/docs/versions.mdx

@@ -0,0 +1,95 @@
+---
+id: versions
+title: Bandwidth Documentation Versions
+slug: /versions
+description: Bandwidth's Developer Docs Versions
+sidebar_label: Versions
+hide_table_of_contents: true
+keywords:
+  - bandwidth
+  - docs
+  - documentation
+  - api
+  - versioning
+  - LTS
+hide_title: false
+image: '@site/static/img/bw-icon.svg'
+---
+
+import LTSVersions from '@site/src/components/LTSVersions.js';
+
+export const versions = [
+    'v2022.10.17'
+]
+
+# Bandwidth Documentation Versions
+
+Bandwidth maintains both current and LTS versions of our docsite and all of its contents.
+What you will find here (dev.bandwidth.com), will always be the most up-to-date version of our docsite.
+If you need to access an old version of our site, you can check the [LTS Versions](#lts-versions) table below.
+Our versions use date-based versioning in the format `vYYYY.MM.DD`.
+
+### LTS Versions
+
+This table contains all of our current LTS versions of the doc site, which are snapshots of the site and its contents taken on the 1st and 16th of each month.
+We maintain up to 12 LTS versions, or 6 months of old content. After 6 months, the LTS versions can still be accessed via Github, but will not be hosted online.
+
+<LTSVersions versions={versions}/>
+
+:::info
+If you need to access a version of the site not listed as an LTS Version, either because the version was not published as an LTS release,
+or because the LTS version is outside of our 6 month support window, please see the [Other Versions](#other-versions) sections below.
+:::
+
+### Other Versions
+
+Even though we only release an LTS version of the site twice a month, the site can have changes published as frequently as once a day. This is possible during periods when multiple domain teams are making documentation changes.
+These releases also follow our date-based versioning schema, and contain changes to the site that were made over the course of a few days at most.
+If you are in need of changes that will only be contained in one of these versions, all of our releases can be found on our [Github Releases Page](https://github.com/Bandwidth/api-docs/releases).
+Instructions for how to use these releases can be found below.
+
+#### Using Github Release Versions
+
+Since versions found in our Github Releases are not hosted online, they will need to be downloaded and accessed locally.
+You can follow these steps to access and run the site locally.
+
+1. **Choose Your Release.**
+    * Find the release that contains the content you want to view. All of our releases can be found [here](https://github.com/Bandwidth/api-docs/releases).
+
+2. **Download and Extract the Release.**
+    * In the `Assests` section on the release page, there will be links to both a `.zip`, and `tar.gz` file that contain the contents of that release.
+    Choose one of the two, download, and extract it to a folder on your PC.
+
+3. **Open Terminal in the `/site` Directory of the Project.**
+    * Navigate to the `/site` directory inside the newly extracted folder and open the terminal of your choice.
+    :::info
+    A lot of our documentation is written in Markdown; therefore, if you are comfortable naviagting the file structure of the project,
+    this documentation can be found in the `/docs` directory, and does not necessarily need to be viewed with the whole site running locally.
+    You may forgo opening a ternimal and following the succeeding steps if you wish to to do this.
+    These files can be viewed in the text editor of your choice, or copy and pasted into a markdown renderer such as [Dillinger](https://dillinger.io/).
+    If you choose to go with this method of viewing the files, note that some formatting may not be supported.
+    :::
+
+4. **Install Packages and Run the Site**
+    * This step requires you to have either [npm](https://www.npmjs.com/) or [yarn](https://yarnpkg.com/) installed.
+    
+    From the terminal run the following commands for npm.
+    ```bash
+    npm i # installs packages
+    npm run start # builds and serves the site locally
+    ```
+
+    **_OR_**
+
+    From the terminal run the following commands for yarn.
+    ```bash
+    yarn # installs packages
+    yarn start # builds and serves the site locally
+    ```
+
+5. **Access the Locally Running Site**
+    * The site can now be accessed via `localhost:3000` and navigated around normally.
+
+:::caution
+Since these versions are running locally, the Algolia search at the top right of our site will not work properly for these sites.
+:::

site/sidebar.js

@@ -4,6 +4,11 @@ module.exports = {
             id: "intro",
             label: "Introduction",
         },
+        {
+            type: "doc",
+            id: "versions",
+            label: "Versions"
+        },
         {
             type: "category",
             label: "Account Management",

site/src/components/LTSVersions.js

@@ -0,0 +1,35 @@
+import React from 'react';
+
+export default function LTSVersions({versions}) {
+    return (
+        <table>
+            <thead>
+                <tr>
+                    <th>LTS Version</th>
+                    <th>Release Date</th>
+                    <th>Sunset Date</th>
+                    <th>Hosted Link</th>
+                    <th>Github Release</th>
+                </tr>
+            </thead>
+            <tbody>
+                {versions.map((version, idx) => {
+                    const s3Version = version.replaceAll(/[^a-z0-9]/g, '-');
+                    const splitVer = version.split('.');
+                    const relDate = new Date(splitVer[0].substring(1), splitVer[1] - 1, splitVer[2]);
+                    var sunDate = new Date();
+                    sunDate.setDate(relDate.getDate() + 180);
+                    return (
+                        <tr key={idx}>
+                            <td>{version}</td>
+                            <td>{relDate.toDateString()}</td>
+                            <td>{sunDate.toDateString()}</td>
+                            <td><a href={`http://bandwidth-api-docs-${s3Version}.s3-website-us-east-1.amazonaws.com/`}>{version}</a></td>
+                            <td><a href={`https://github.com/Bandwidth/api-docs/releases/tag/${version}`}>{version}</a></td>
+                        </tr>
+                    )
+                })}
+            </tbody>
+        </table>
+    )
+}