Show FB internal instructions by default on "Getting Started" page

Summary:
Show internal instructions for Flipper setup by default on "Getting Started" page. This is a follow up to https://fb.workplace.com/groups/flippersupport/permalink/955763464904312/.

I used tabs component to show both internal and external content in tabs. By default, internal content is shown, but it is possible to also switch to external.

Reviewed By: jknoxville

Differential Revision: D23649955

fbshipit-source-id: c4f956e0ee9fec69cf861d96a447f934f746dd7f

docs/getting-started/index.mdx

@@ -3,6 +3,7 @@ id: index
 title: Desktop App
 ---
 import useBaseUrl from '@docusaurus/useBaseUrl';
+import FBContent from '../../website/src/components/FBContent';
 
 Flipper helps you debug Android and iOS apps running in an emulator/simulator or connected physical development devices. Flipper consists of two parts:
 
@@ -11,12 +12,7 @@ Flipper helps you debug Android and iOS apps running in an emulator/simulator or
 
 To use Flipper, you need to add the mobile SDK to your app. If you are using React Native 0.62 or higher, this is largely done automatically for you.
 
----
-
-The desktop part of Flipper doesn't need any particular setup. Simply download the latest build for [Mac](https://www.facebook.com/fbflipper/public/mac), [Linux](https://www.facebook.com/fbflipper/public/linux) or [Windows](https://www.facebook.com/fbflipper/public/windows) and launch it. In order to work properly, Flipper requires a working installation of the Android and (if where applicable) iOS development tools on your system, as well as the [OpenSSL](https://www.openssl.org) binary on your `$PATH`.
-
-OpenSSL for Windows can be downloaded [here](https://slproweb.com/products/Win32OpenSSL.html).
-
-Once you start Flipper and launch an emulator/simulator or connect a device, you will already be able to see the device logs in Flipper. To see app specific data, you need to integrate our native SDKs with your app.
-
-<img alt="Logs plugin" src={useBaseUrl("img/initial.png")} />
+<FBContent
+    internal={() => require('./fb/using-flipper-at-facebook.mdx')}
+    external={() => require('./using-flipper.mdx')}
+/>

docs/getting-started/using-flipper.mdx

@@ -0,0 +1,13 @@
+---
+id: using-flipper
+title: Desktop App
+---
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
+The desktop part of Flipper doesn't need any particular setup. Simply download the latest build for [Mac](https://www.facebook.com/fbflipper/public/mac), [Linux](https://www.facebook.com/fbflipper/public/linux) or [Windows](https://www.facebook.com/fbflipper/public/windows) and launch it. In order to work properly, Flipper requires a working installation of the Android and (if where applicable) iOS development tools on your system, as well as the [OpenSSL](https://www.openssl.org) binary on your `$PATH`.
+
+OpenSSL for Windows can be downloaded [here](https://slproweb.com/products/Win32OpenSSL.html).
+
+Once you start Flipper and launch an emulator/simulator or connect a device, you will already be able to see the device logs in Flipper. To see app specific data, you need to integrate our native SDKs with your app.
+
+<img alt="Logs plugin" src={useBaseUrl("img/initial.png")} />

website/sidebars.js

@@ -29,7 +29,6 @@ module.exports = {
   },
   setup: {
     'Getting Started': [
-      ...fbInternalOnly(['getting-started/fb/using-flipper-at-facebook']),
       'getting-started/index',
       'getting-started/android-native',
       'getting-started/ios-native',

website/src/components/FBContent.jsx

@@ -0,0 +1,48 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+import React from 'react';
+import {isInternal} from 'internaldocs-fb-helpers';
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+function createElement(createElement) {
+  if (!createElement) return undefined;
+  if (React.isValidElement(createElement)) {
+    return createElement;
+  }
+  const element = createElement();
+  if (React.isValidElement(element)) {
+    return element;
+  }
+  return React.createElement(element.default || element, {});
+}
+
+function FBContent({internal, external}) {
+  if (!isInternal()) {
+    return createElement(external);
+  }
+  if (internal && external) {
+    return (
+      <Tabs
+        defaultValue="internal-docs"
+        values={[
+          {label: 'FB Internal', value: 'internal-docs'},
+          {label: 'Open-Source', value: 'external-docs'},
+        ]}>
+        <TabItem value="internal-docs">{createElement(internal)}</TabItem>
+        <TabItem value="external-docs">{createElement(external)}</TabItem>
+      </Tabs>
+    );
+  } else {
+    return createElement(internal || external);
+  }
+}
+
+export default FBContent;