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
This commit is contained in:
committed by
Facebook GitHub Bot
parent
1f62ce32bf
commit
12d7b48443
@@ -3,6 +3,7 @@ id: index
|
|||||||
title: Desktop App
|
title: Desktop App
|
||||||
---
|
---
|
||||||
import useBaseUrl from '@docusaurus/useBaseUrl';
|
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:
|
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.
|
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.
|
||||||
|
|
||||||
---
|
<FBContent
|
||||||
|
internal={() => require('./fb/using-flipper-at-facebook.mdx')}
|
||||||
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`.
|
external={() => require('./using-flipper.mdx')}
|
||||||
|
/>
|
||||||
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")} />
|
|
||||||
|
|||||||
13
docs/getting-started/using-flipper.mdx
Normal file
13
docs/getting-started/using-flipper.mdx
Normal file
@@ -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")} />
|
||||||
@@ -29,7 +29,6 @@ module.exports = {
|
|||||||
},
|
},
|
||||||
setup: {
|
setup: {
|
||||||
'Getting Started': [
|
'Getting Started': [
|
||||||
...fbInternalOnly(['getting-started/fb/using-flipper-at-facebook']),
|
|
||||||
'getting-started/index',
|
'getting-started/index',
|
||||||
'getting-started/android-native',
|
'getting-started/android-native',
|
||||||
'getting-started/ios-native',
|
'getting-started/ios-native',
|
||||||
|
|||||||
48
website/src/components/FBContent.jsx
Normal file
48
website/src/components/FBContent.jsx
Normal file
@@ -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;
|
||||||
Reference in New Issue
Block a user