Add integration labels

Author: pwseg

src/_data/support-types.yml

@@ -0,0 +1,10 @@
+types:
+  - display_name: Community
+    slug: community
+    support-note: "Segment originally developed but no longer manages or updates community libraries. These libraries are available on GitHub under the MIT License for the open-source community."
+  - display_name: Legacy
+    slug: legacy
+    support-note: "Legacy libraries function reliably and send data as intended but receive no new feature support other than security and privacy updates."
+  - display_name: Flagship
+    slug: flagship
+    support-note: "Flagship libraries offer the most up-to-date functionality on Segment’s most popular platforms. Segment actively maintains flagship libraries, which benefit from new feature releases and ongoing development and support."

src/_includes/content/support-grid.md

@@ -0,0 +1,36 @@
+<!--
+This include is adapted from the plan-grid.md include.
+An additional support-types.yml data file is added to centralize the support type data.
+-->
+{% assign supportTypesData = site.data.support-types.types %}
+{% assign supportType = supportTypesData | where: "slug", page.support_type | first %}
+<!-- The line below hides the grid if there's no matching data in sources.yml-->
+{% if supportType %}
+
+<div class="popover" data-popover data-active-class="popover--active">
+<div class="flex flex--wrap waffle" style="margin-top: 8px;" >
+
+{% for item in supportTypesData %}
+{% if item.slug == supportType.slug %}
+<div class="flex__column flex__column--shrink">
+        <span class="badge badge--{% if item.slug == 'community' %}warning{% elsif item.slug == 'legacy' %}gray{% elsif item.slug == 'flagship' %}success{%endif%}"> {{item.display_name | capitalize }} ✓ </span>
+</div>
+{% else %}
+<div class="flex__column flex__column--shrink">
+        <span class="badge badge--gray" style="opacity:0.2"> {{item.slug | capitalize }} x </span>
+        </div>
+{% endif %}
+{% endfor %}
+
+<div class="flex__column flex__column--shrink" style="padding-top:0px">
+  <a class="recent-contributor__button" style="padding: 4px 10px;" href="#" data-popover-target="contributors">?</a>
+</div>
+</div>
+
+<div class="popover__body" data-popover-body="contributors">
+{% if supportType.support-note %}
+<p style="font-size:12px">{{supportType.support-note}}</p>
+{% endif %}
+</div>
+</div>
+{% endif %}

src/_layouts/integration.html

@@ -48,6 +48,7 @@
                 <h1 id="{{ page.title | slugify }}">
                   {{ page.title }}
                 </h1>
+                {% include content/support-grid.md %}
               {%- endif -%}
 
               {%- if page.excerpt -%}

src/_sass/components/_badge.scss

@@ -23,6 +23,10 @@
     background-color: lighten(color(error), 10%);
     color: white;
   }
+  &--warning {
+    background-color: lighten(color(warning), 40%);
+    color: color(warning-dark);
+  }
 
   &--none {
     background-color: white;

src/connections/sources/catalog/libraries/mobile/apple/index.md

@@ -5,6 +5,7 @@ redirect_from:
   - '/connections/sources/catalog/cloud-apps/swift/'
   - '/connections/sources/catalog/libraries/mobile/swift-ios/'
 id: dZeHygTSD4
+support_type: flagship
 tags:
   - apple
   - swift

src/connections/sources/catalog/libraries/mobile/kotlin-android/index.md

@@ -4,6 +4,7 @@ strat: kotlin-android
 redirect_from:
   - '/connections/sources/catalog/cloud-apps/kotlin/'
 id: dZeHygTSD4
+support_type: flagship
 tags:
   - android
   - kotlin

src/connections/sources/catalog/libraries/mobile/react-native/index.md

@@ -1,6 +1,7 @@
 ---
 title: Analytics for React Native
 strat: react-native
+support_type: flagship
 id: B0X0QmvMny
 ---
 

src/connections/sources/catalog/libraries/mobile/xamarin/index.md

@@ -3,6 +3,7 @@ title: Analytics for Xamarin
 sourceTitle: 'Xamarin'
 sourceCategory: 'Mobile'
 id: wcssVcPJrc
+support_type: community
 ---
 Segment's [Xamarin](http://xamarin.com/) Portable Class Library ([PCL](http://developer.xamarin.com/guides/cross-platform/application_fundamentals/pcl/)) is the best way to integrate analytics into your Xamarin application. It lets you record analytics data from your C#, F#, and .NET code, and supports `PCL Profile 4.0 - Profile136`, which targets the following platforms:
 

src/connections/sources/catalog/libraries/server/node/index.md

@@ -3,6 +3,7 @@ title: Analytics for Node.js
 redirect_from: '/connections/sources/catalog/libraries/server/node-js/'
 repo: analytics-next
 strat: node-js
+support_type: flagship
 ---
 
 Segment's Analytics Node.js library lets you record analytics data from your node code. The requests hit Segment's servers, and then Segment routes your data to any destinations you have enabled.

src/connections/sources/catalog/libraries/website/javascript/index.md

@@ -6,6 +6,7 @@ redirect_from:
   - '/sources/website/analytics.js/'
   - '/connections/sources/catalog/libraries/website/javascript/analytics-js-2/'
 strat: ajs
+support_type: flagship
 id: IqDTy1TpoU
 ---