From 55323821e3334ce49f6e1550e0534891dc21f49c Mon Sep 17 00:00:00 2001 From: generatedunixname89002005306973 Date: Tue, 16 Jul 2024 06:51:24 -0700 Subject: [PATCH 01/10] Flipper Release: v0.258.0 Summary: Releasing version 0.258.0 Reviewed By: passy Differential Revision: D59804481 fbshipit-source-id: bdeb92c6bde24cf08cdd1bc8d1ad056909097afa --- desktop/package.json | 2 +- desktop/plugins/public/layout/docs/setup.mdx | 2 +- desktop/plugins/public/leak_canary/docs/setup.mdx | 2 +- desktop/plugins/public/network/docs/setup.mdx | 2 +- desktop/static/CHANGELOG.md | 5 +++++ docs/getting-started/android-native.mdx | 4 ++-- docs/getting-started/react-native-ios.mdx | 2 +- docs/getting-started/react-native.mdx | 4 ++-- gradle.properties | 2 +- js/js-flipper/package.json | 2 +- react-native/react-native-flipper/package.json | 2 +- 11 files changed, 17 insertions(+), 12 deletions(-) diff --git a/desktop/package.json b/desktop/package.json index 6c043b53a39..cea7414b8aa 100644 --- a/desktop/package.json +++ b/desktop/package.json @@ -165,7 +165,7 @@ "npm": "use yarn instead", "yarn": "^1.16" }, - "version": "0.257.0", + "version": "0.258.0", "workspaces": { "packages": [ "scripts", diff --git a/desktop/plugins/public/layout/docs/setup.mdx b/desktop/plugins/public/layout/docs/setup.mdx index 4b49b8a9c56..8cbb4b83f88 100644 --- a/desktop/plugins/public/layout/docs/setup.mdx +++ b/desktop/plugins/public/layout/docs/setup.mdx @@ -27,7 +27,7 @@ You also need to compile in the `litho-annotations` package, as Flipper reflects ```groovy dependencies { - debugImplementation 'com.facebook.flipper:flipper-litho-plugin:0.257.0' + debugImplementation 'com.facebook.flipper:flipper-litho-plugin:0.258.0' debugImplementation 'com.facebook.litho:litho-annotations:0.19.0' // ... } diff --git a/desktop/plugins/public/leak_canary/docs/setup.mdx b/desktop/plugins/public/leak_canary/docs/setup.mdx index 0a272114d4c..08192e6f960 100644 --- a/desktop/plugins/public/leak_canary/docs/setup.mdx +++ b/desktop/plugins/public/leak_canary/docs/setup.mdx @@ -8,7 +8,7 @@ To setup the LeakCan ```groovy dependencies { - debugImplementation 'com.facebook.flipper:flipper-leakcanary2-plugin:0.257.0' + debugImplementation 'com.facebook.flipper:flipper-leakcanary2-plugin:0.258.0' debugImplementation 'com.squareup.leakcanary:leakcanary-android:2.8.1' } ``` diff --git a/desktop/plugins/public/network/docs/setup.mdx b/desktop/plugins/public/network/docs/setup.mdx index 12e154e3fa7..b6c941140dc 100644 --- a/desktop/plugins/public/network/docs/setup.mdx +++ b/desktop/plugins/public/network/docs/setup.mdx @@ -11,7 +11,7 @@ The network plugin is shipped as a separate Maven artifact, as follows: ```groovy dependencies { - debugImplementation 'com.facebook.flipper:flipper-network-plugin:0.257.0' + debugImplementation 'com.facebook.flipper:flipper-network-plugin:0.258.0' } ``` diff --git a/desktop/static/CHANGELOG.md b/desktop/static/CHANGELOG.md index d593f9aaf7d..d346becf32c 100644 --- a/desktop/static/CHANGELOG.md +++ b/desktop/static/CHANGELOG.md @@ -1,3 +1,8 @@ +# 0.258.0 (16/7/2024) + + * [D59629955](https://github.com/facebook/flipper/search?q=D59629955&type=Commits) - Update offline message + + # 0.257.0 (10/7/2024) * [D59001348](https://github.com/facebook/flipper/search?q=D59001348&type=Commits) - [Internal] diff --git a/docs/getting-started/android-native.mdx b/docs/getting-started/android-native.mdx index 22acd81b231..dc712d6cc18 100644 --- a/docs/getting-started/android-native.mdx +++ b/docs/getting-started/android-native.mdx @@ -24,10 +24,10 @@ repositories { } dependencies { - debugImplementation 'com.facebook.flipper:flipper:0.257.0' + debugImplementation 'com.facebook.flipper:flipper:0.258.0' debugImplementation 'com.facebook.soloader:soloader:0.10.5' - releaseImplementation 'com.facebook.flipper:flipper-noop:0.257.0' + releaseImplementation 'com.facebook.flipper:flipper-noop:0.258.0' } ``` diff --git a/docs/getting-started/react-native-ios.mdx b/docs/getting-started/react-native-ios.mdx index 5bc7f3b0726..1c4c81b12b8 100644 --- a/docs/getting-started/react-native-ios.mdx +++ b/docs/getting-started/react-native-ios.mdx @@ -51,7 +51,7 @@ Add all of the code below to your `ios/Podfile`: platform :ios, '9.0' def flipper_pods() - flipperkit_version = '0.257.0' # should match the version of your Flipper client app + flipperkit_version = '0.258.0' # should match the version of your Flipper client app pod 'FlipperKit', '~>' + flipperkit_version, :configuration => 'Debug' pod 'FlipperKit/FlipperKitLayoutPlugin', '~>' + flipperkit_version, :configuration => 'Debug' pod 'FlipperKit/SKIOSNetworkPlugin', '~>' + flipperkit_version, :configuration => 'Debug' diff --git a/docs/getting-started/react-native.mdx b/docs/getting-started/react-native.mdx index 2ece2118838..8692f66f2bf 100644 --- a/docs/getting-started/react-native.mdx +++ b/docs/getting-started/react-native.mdx @@ -34,7 +34,7 @@ Latest version of Flipper requires react-native 0.69+! If you use react-native < Android: -1. Bump the `FLIPPER_VERSION` variable in `android/gradle.properties`, for example: `FLIPPER_VERSION=0.257.0`. +1. Bump the `FLIPPER_VERSION` variable in `android/gradle.properties`, for example: `FLIPPER_VERSION=0.258.0`. 2. Run `./gradlew clean` in the `android` directory. iOS: @@ -44,7 +44,7 @@ react-native version => 0.69.0 2. Run `pod install --repo-update` in the `ios` directory. react-native version < 0.69.0 -1. Call `use_flipper` with a specific version in `ios/Podfile`, for example: `use_flipper!({ 'Flipper' => '0.257.0' })`. +1. Call `use_flipper` with a specific version in `ios/Podfile`, for example: `use_flipper!({ 'Flipper' => '0.258.0' })`. 2. Run `pod install --repo-update` in the `ios` directory. ## Manual Setup diff --git a/gradle.properties b/gradle.properties index bdca638aa1e..fb56d70a6ca 100644 --- a/gradle.properties +++ b/gradle.properties @@ -3,7 +3,7 @@ # This source code is licensed under the MIT license found in the # LICENSE file in the root directory of this source tree. # POM publishing constants -VERSION_NAME=0.257.1-SNAPSHOT +VERSION_NAME=0.258.0 GROUP=com.facebook.flipper SONATYPE_STAGING_PROFILE=comfacebook POM_URL=https://github.com/facebook/flipper diff --git a/js/js-flipper/package.json b/js/js-flipper/package.json index f1ee533711c..04615f282eb 100644 --- a/js/js-flipper/package.json +++ b/js/js-flipper/package.json @@ -1,7 +1,7 @@ { "name": "js-flipper", "title": "JS Flipper Bindings for Web-Socket based clients", - "version": "0.257.0", + "version": "0.258.0", "main": "lib/index.js", "browser": { "os": false diff --git a/react-native/react-native-flipper/package.json b/react-native/react-native-flipper/package.json index 1874bce6dee..1fc0e05d9b1 100644 --- a/react-native/react-native-flipper/package.json +++ b/react-native/react-native-flipper/package.json @@ -1,7 +1,7 @@ { "name": "react-native-flipper", "title": "React Native Flipper Bindings", - "version": "0.257.0", + "version": "0.258.0", "description": "Flipper bindings for React Native", "main": "index.js", "types": "index.d.ts", From 65c141d40d123e4ebcf93f8eee80b15abd49d5fb Mon Sep 17 00:00:00 2001 From: generatedunixname89002005306973 Date: Tue, 16 Jul 2024 06:51:24 -0700 Subject: [PATCH 02/10] Flipper Snapshot Bump: v0.258.1-SNAPSHOT Summary: Releasing snapshot version 0.258.1-SNAPSHOT Reviewed By: passy Differential Revision: D59804482 fbshipit-source-id: f16939ca8eb491c7657e698f8278e13504f87e1a --- docs/getting-started/android-native.mdx | 4 ++-- gradle.properties | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/getting-started/android-native.mdx b/docs/getting-started/android-native.mdx index dc712d6cc18..5c29b667f92 100644 --- a/docs/getting-started/android-native.mdx +++ b/docs/getting-started/android-native.mdx @@ -124,10 +124,10 @@ repositories { } dependencies { - debugImplementation 'com.facebook.flipper:flipper:0.257.1-SNAPSHOT' + debugImplementation 'com.facebook.flipper:flipper:0.258.1-SNAPSHOT' debugImplementation 'com.facebook.soloader:soloader:0.10.5' - releaseImplementation 'com.facebook.flipper:flipper-noop:0.257.1-SNAPSHOT' + releaseImplementation 'com.facebook.flipper:flipper-noop:0.258.1-SNAPSHOT' } ``` diff --git a/gradle.properties b/gradle.properties index fb56d70a6ca..0c80f90ba4b 100644 --- a/gradle.properties +++ b/gradle.properties @@ -3,7 +3,7 @@ # This source code is licensed under the MIT license found in the # LICENSE file in the root directory of this source tree. # POM publishing constants -VERSION_NAME=0.258.0 +VERSION_NAME=0.258.1-SNAPSHOT GROUP=com.facebook.flipper SONATYPE_STAGING_PROFILE=comfacebook POM_URL=https://github.com/facebook/flipper From 8eafb064bff8324a04e679429c79b83d88150471 Mon Sep 17 00:00:00 2001 From: Anton Kastritskiy Date: Tue, 16 Jul 2024 09:43:27 -0700 Subject: [PATCH 03/10] remove broken shareble link feature Summary: This has been broken for over a year, see [comments](https://fb.workplace.com/groups/flippersupport/posts/1651007205379931/?comment_id=1875107449636571&reply_comment_id=1875591292921520) Differential Revision: D59810879 fbshipit-source-id: 4b8e32d6a1ecabd2e68087db1d74add101c39b00 --- .../src/chrome/ShareSheetExportUrl.tsx | 224 ------------------ desktop/flipper-ui/src/fb-stubs/constants.tsx | 3 - .../flipper-ui/src/sandy-chrome/Navbar.tsx | 16 -- desktop/flipper-ui/src/utils/exportData.tsx | 16 +- 4 files changed, 1 insertion(+), 258 deletions(-) delete mode 100644 desktop/flipper-ui/src/chrome/ShareSheetExportUrl.tsx diff --git a/desktop/flipper-ui/src/chrome/ShareSheetExportUrl.tsx b/desktop/flipper-ui/src/chrome/ShareSheetExportUrl.tsx deleted file mode 100644 index a2a60ccfbac..00000000000 --- a/desktop/flipper-ui/src/chrome/ShareSheetExportUrl.tsx +++ /dev/null @@ -1,224 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and 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 {FlexColumn, styled, Text, FlexRow, Spacer, Input} from '../ui'; -import React, {Component} from 'react'; -import {ReactReduxContext, ReactReduxContextValue} from 'react-redux'; -import {Logger} from 'flipper-common'; -import {IdlerImpl} from '../utils/Idler'; -import { - DataExportResult, - DataExportError, - shareFlipperData, -} from '../fb-stubs/user'; -import { - exportStore, - EXPORT_FLIPPER_TRACE_EVENT, - displayFetchMetadataErrors, -} from '../utils/exportData'; -import ShareSheetErrorList from './ShareSheetErrorList'; -import {reportPlatformFailures} from 'flipper-common'; -import ShareSheetPendingDialog from './ShareSheetPendingDialog'; -import {getLogger} from 'flipper-common'; -import {MiddlewareAPI} from '../reducers/index'; -import {getFlipperLib, Layout} from 'flipper-plugin'; -import {Button, Modal} from 'antd'; - -export const SHARE_FLIPPER_TRACE_EVENT = 'share-flipper-link'; - -const Copy = styled(Input)({ - marginRight: 0, - marginBottom: 15, -}); - -const InfoText = styled(Text)({ - lineHeight: 1.35, - marginBottom: 15, -}); - -const Title = styled(Text)({ - marginBottom: 6, -}); - -const ErrorMessage = styled(Text)({ - display: 'block', - marginTop: 6, - wordBreak: 'break-all', - whiteSpace: 'pre-line', - lineHeight: 1.35, -}); - -type Props = { - onHide: () => any; - logger: Logger; -}; - -type State = { - fetchMetaDataErrors: { - [plugin: string]: Error; - } | null; - result: DataExportError | DataExportResult | null; - statusUpdate: string | null; -}; - -export default class ShareSheetExportUrl extends Component { - static contextType: React.Context = ReactReduxContext; - - state: State = { - fetchMetaDataErrors: null, - result: null, - statusUpdate: null, - }; - - get store(): MiddlewareAPI { - return this.context.store; - } - - idler = new IdlerImpl(); - - async componentDidMount() { - const mark = 'shareSheetExportUrl'; - performance.mark(mark); - try { - const statusUpdate = (msg: string) => { - this.setState({statusUpdate: msg}); - }; - const {serializedString, fetchMetaDataErrors} = - await reportPlatformFailures( - exportStore(this.store, false, this.idler, statusUpdate), - `${EXPORT_FLIPPER_TRACE_EVENT}:UI_LINK`, - ); - const uploadMarker = `${EXPORT_FLIPPER_TRACE_EVENT}:upload`; - performance.mark(uploadMarker); - statusUpdate('Uploading Flipper Export...'); - const result = await reportPlatformFailures( - shareFlipperData(serializedString), - `${SHARE_FLIPPER_TRACE_EVENT}`, - ); - - if ((result as DataExportError).error != undefined) { - const res = result as DataExportError; - const err = new Error(res.error); - err.stack = res.stacktrace; - throw err; - } - getLogger().trackTimeSince(uploadMarker, uploadMarker, { - plugins: this.store.getState().plugins.selectedPlugins, - }); - const flipperUrl = (result as DataExportResult).flipperUrl; - if (flipperUrl) { - getFlipperLib().writeTextToClipboard(String(flipperUrl)); - new Notification('Shareable Flipper Export created', { - body: 'URL copied to clipboard', - requireInteraction: true, - }); - } - this.setState({fetchMetaDataErrors, result}); - this.props.logger.trackTimeSince(mark, 'export:url-success'); - } catch (e) { - const result: DataExportError = { - error_class: 'EXPORT_ERROR', - error: e, - stacktrace: '', - }; - if (e instanceof Error) { - result.error = e.message; - result.stacktrace = e.stack || ''; - } - // Show the error in UI. - this.setState({result}); - this.props.logger.trackTimeSince(mark, 'export:url-error', result); - console.error('Failed to export to flipper trace', e); - } - } - - componentDidUpdate() { - const {result} = this.state; - if (!result || !(result as DataExportResult).flipperUrl) { - return; - } - } - - cancelAndHide = () => { - this.props.onHide(); - this.idler.cancel(); - }; - - renderPending(statusUpdate: string | null) { - return ( - - - - ); - } - - render() { - const {result, statusUpdate, fetchMetaDataErrors} = this.state; - if (!result) { - return this.renderPending(statusUpdate); - } - - const {title, errorArray} = displayFetchMetadataErrors(fetchMetaDataErrors); - return ( - - - <> - - {(result as DataExportResult).flipperUrl ? ( - <> - Data Upload Successful - - Flipper's data was successfully uploaded. This URL can be - used to share with other Flipper users. Opening it will - import the data from your export. - - - - When sharing your Flipper link, consider that the captured - data might contain sensitve information like access tokens - used in network requests. - - - - ) : ( - <> - - {(result as DataExportError).error_class || 'Error'} - - - {(result as DataExportError).error || - 'The data could not be uploaded'} - - - )} - - - - - - - - - ); - } -} diff --git a/desktop/flipper-ui/src/fb-stubs/constants.tsx b/desktop/flipper-ui/src/fb-stubs/constants.tsx index 501d88ea1d5..da1e3b8571e 100644 --- a/desktop/flipper-ui/src/fb-stubs/constants.tsx +++ b/desktop/flipper-ui/src/fb-stubs/constants.tsx @@ -12,9 +12,6 @@ import {DeviceOS} from 'flipper-plugin'; export default Object.freeze({ IS_PUBLIC_BUILD: true, - // Enables the flipper data to be exported through shareabale link - ENABLE_SHAREABLE_LINK: false, - FEEDBACK_GROUP_LINK: 'https://github.com/facebook/flipper/issues', // Workplace Group ID's diff --git a/desktop/flipper-ui/src/sandy-chrome/Navbar.tsx b/desktop/flipper-ui/src/sandy-chrome/Navbar.tsx index 52326841af5..90125e0576b 100644 --- a/desktop/flipper-ui/src/sandy-chrome/Navbar.tsx +++ b/desktop/flipper-ui/src/sandy-chrome/Navbar.tsx @@ -53,11 +53,9 @@ import { ExportEverythingEverywhereAllAtOnceStatus, startFileImport, startFileExport, - startLinkExport, } from '../utils/exportData'; import UpdateIndicator from '../chrome/UpdateIndicator'; import {css} from '@emotion/css'; -import constants from '../fb-stubs/constants'; import {setStaticView} from '../reducers/connections'; import {StyleGuide} from './StyleGuide'; import {openDeeplinkDialog} from '../deeplink'; @@ -638,11 +636,6 @@ function ExtrasMenu() { () => startFileExport(store.dispatch), [store.dispatch], ); - const startLinkExportTracked = useTrackedCallback( - 'Link export', - () => startLinkExport(store.dispatch), - [store.dispatch], - ); const startFileImportTracked = useTrackedCallback( 'File import', () => startFileImport(store), @@ -679,15 +672,6 @@ function ExtrasMenu() { label: 'Export Flipper file', onClick: startFileExportTracked, }, - ...(constants.ENABLE_SHAREABLE_LINK - ? [ - { - key: 'exportShareableLink', - label: 'Export shareable link', - onClick: startLinkExportTracked, - }, - ] - : []), { type: 'divider', }, diff --git a/desktop/flipper-ui/src/utils/exportData.tsx b/desktop/flipper-ui/src/utils/exportData.tsx index 4f5d24c0816..4ae11306bc4 100644 --- a/desktop/flipper-ui/src/utils/exportData.tsx +++ b/desktop/flipper-ui/src/utils/exportData.tsx @@ -28,7 +28,6 @@ import {processMessageQueue} from './messageQueue'; import {getPluginTitle} from './pluginUtils'; import {Dialog, getFlipperLib, Idler} from 'flipper-plugin'; import {ClientQuery} from 'flipper-common'; -import ShareSheetExportUrl from '../chrome/ShareSheetExportUrl'; import ShareSheetExportFile from '../chrome/ShareSheetExportFile'; import ExportDataPluginSheet from '../chrome/ExportDataPluginSheet'; import {exportLogs} from '../chrome/ConsoleLogs'; @@ -456,7 +455,7 @@ async function getStoreExport( export async function exportStore( store: MiddlewareAPI, - includeSupportDetails?: boolean, + _includeSupportDetails?: boolean, idler: Idler = new TestIdler(true), statusUpdate: (msg: string) => void = () => {}, ): Promise<{ @@ -755,19 +754,6 @@ export async function startFileExport(dispatch: Store['dispatch']) { )); } -export async function startLinkExport(dispatch: Store['dispatch']) { - const plugins = await selectPlugins(); - if (plugins === false) { - return; // cancelled - } - // TODO: no need to put this in the store, - // need to be cleaned up later in combination with SupportForm - dispatch(selectedPlugins(plugins)); - Dialog.showModal((onHide) => ( - - )); -} - async function selectPlugins() { return await Dialog.select({ title: 'Select plugins to export', From 82ae3a169b3daa993dd7a2aa88bc33f0519b9ebf Mon Sep 17 00:00:00 2001 From: Michel Weststrate Date: Wed, 17 Jul 2024 07:13:57 -0700 Subject: [PATCH 04/10] Fix flipper-pkg release Summary: After some debug tracing it turned out that the help-plugin made oclif/dev-cli crash, probably it was written for a different major version of oclif. Downgrading the plugin fixed the crash. This should fix https://github.com/facebook/flipper/issues/5223 / https://github.com/facebook/flipper/actions/runs/9958257588/job/27512213194 Reviewed By: passy Differential Revision: D59855784 fbshipit-source-id: 80de8c6443c3db3b874380817e8f8aa02420abc2 --- desktop/pkg/package.json | 2 +- desktop/yarn.lock | 20 +++++++++++++++----- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/desktop/pkg/package.json b/desktop/pkg/package.json index 96e965dae26..9bee7c22f32 100644 --- a/desktop/pkg/package.json +++ b/desktop/pkg/package.json @@ -15,7 +15,7 @@ "@oclif/command": "^1.8.36", "@oclif/config": "^1.18.17", "@oclif/parser": "^3.8.17", - "@oclif/plugin-help": "^5.2.20", + "@oclif/plugin-help": "^3.3.1", "@oclif/plugin-warn-if-update-available": "^2.1.1", "ajv": "^6.12.2", "ajv-errors": "^1.0.1", diff --git a/desktop/yarn.lock b/desktop/yarn.lock index a6bab64a0a4..47edeae3885 100644 --- a/desktop/yarn.lock +++ b/desktop/yarn.lock @@ -3083,12 +3083,22 @@ widest-line "^3.1.0" wrap-ansi "^6.2.0" -"@oclif/plugin-help@^5.2.20": - version "5.2.20" - resolved "https://registry.yarnpkg.com/@oclif/plugin-help/-/plugin-help-5.2.20.tgz#4035a0ac231f95fb8e334da342175e3ca00f6abc" - integrity sha512-u+GXX/KAGL9S10LxAwNUaWdzbEBARJ92ogmM7g3gDVud2HioCmvWQCDohNRVZ9GYV9oKwZ/M8xwd6a1d95rEKQ== +"@oclif/plugin-help@^3.3.1": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@oclif/plugin-help/-/plugin-help-3.3.1.tgz#36adb4e0173f741df409bb4b69036d24a53bfb24" + integrity sha512-QuSiseNRJygaqAdABYFWn/H1CwIZCp9zp/PLid6yXvy6VcQV7OenEFF5XuYaCvSARe2Tg9r8Jqls5+fw1A9CbQ== dependencies: - "@oclif/core" "^2.15.0" + "@oclif/command" "^1.8.15" + "@oclif/config" "1.18.2" + "@oclif/errors" "1.3.5" + "@oclif/help" "^1.0.1" + chalk "^4.1.2" + indent-string "^4.0.0" + lodash "^4.17.21" + string-width "^4.2.0" + strip-ansi "^6.0.0" + widest-line "^3.1.0" + wrap-ansi "^6.2.0" "@oclif/plugin-warn-if-update-available@^2.1.1": version "2.1.1" From b3def6cdf2958446d94b3c78e2622ba820285a0d Mon Sep 17 00:00:00 2001 From: generatedunixname89002005306973 Date: Wed, 17 Jul 2024 08:01:53 -0700 Subject: [PATCH 05/10] Flipper Release: v0.259.0 Summary: Releasing version 0.259.0 Reviewed By: passy Differential Revision: D59852781 fbshipit-source-id: 6ef33c7154433477f48e8b7824ab0d69c3d326ea --- desktop/package.json | 2 +- desktop/plugins/public/layout/docs/setup.mdx | 2 +- desktop/plugins/public/leak_canary/docs/setup.mdx | 2 +- desktop/plugins/public/network/docs/setup.mdx | 2 +- docs/getting-started/android-native.mdx | 4 ++-- docs/getting-started/react-native-ios.mdx | 2 +- docs/getting-started/react-native.mdx | 4 ++-- gradle.properties | 2 +- js/js-flipper/package.json | 2 +- react-native/react-native-flipper/package.json | 2 +- 10 files changed, 12 insertions(+), 12 deletions(-) diff --git a/desktop/package.json b/desktop/package.json index cea7414b8aa..20343ea5d2a 100644 --- a/desktop/package.json +++ b/desktop/package.json @@ -165,7 +165,7 @@ "npm": "use yarn instead", "yarn": "^1.16" }, - "version": "0.258.0", + "version": "0.259.0", "workspaces": { "packages": [ "scripts", diff --git a/desktop/plugins/public/layout/docs/setup.mdx b/desktop/plugins/public/layout/docs/setup.mdx index 8cbb4b83f88..268d3e63451 100644 --- a/desktop/plugins/public/layout/docs/setup.mdx +++ b/desktop/plugins/public/layout/docs/setup.mdx @@ -27,7 +27,7 @@ You also need to compile in the `litho-annotations` package, as Flipper reflects ```groovy dependencies { - debugImplementation 'com.facebook.flipper:flipper-litho-plugin:0.258.0' + debugImplementation 'com.facebook.flipper:flipper-litho-plugin:0.259.0' debugImplementation 'com.facebook.litho:litho-annotations:0.19.0' // ... } diff --git a/desktop/plugins/public/leak_canary/docs/setup.mdx b/desktop/plugins/public/leak_canary/docs/setup.mdx index 08192e6f960..406238b2917 100644 --- a/desktop/plugins/public/leak_canary/docs/setup.mdx +++ b/desktop/plugins/public/leak_canary/docs/setup.mdx @@ -8,7 +8,7 @@ To setup the LeakCan ```groovy dependencies { - debugImplementation 'com.facebook.flipper:flipper-leakcanary2-plugin:0.258.0' + debugImplementation 'com.facebook.flipper:flipper-leakcanary2-plugin:0.259.0' debugImplementation 'com.squareup.leakcanary:leakcanary-android:2.8.1' } ``` diff --git a/desktop/plugins/public/network/docs/setup.mdx b/desktop/plugins/public/network/docs/setup.mdx index b6c941140dc..02c2c0782c2 100644 --- a/desktop/plugins/public/network/docs/setup.mdx +++ b/desktop/plugins/public/network/docs/setup.mdx @@ -11,7 +11,7 @@ The network plugin is shipped as a separate Maven artifact, as follows: ```groovy dependencies { - debugImplementation 'com.facebook.flipper:flipper-network-plugin:0.258.0' + debugImplementation 'com.facebook.flipper:flipper-network-plugin:0.259.0' } ``` diff --git a/docs/getting-started/android-native.mdx b/docs/getting-started/android-native.mdx index 5c29b667f92..adeb24a2626 100644 --- a/docs/getting-started/android-native.mdx +++ b/docs/getting-started/android-native.mdx @@ -24,10 +24,10 @@ repositories { } dependencies { - debugImplementation 'com.facebook.flipper:flipper:0.258.0' + debugImplementation 'com.facebook.flipper:flipper:0.259.0' debugImplementation 'com.facebook.soloader:soloader:0.10.5' - releaseImplementation 'com.facebook.flipper:flipper-noop:0.258.0' + releaseImplementation 'com.facebook.flipper:flipper-noop:0.259.0' } ``` diff --git a/docs/getting-started/react-native-ios.mdx b/docs/getting-started/react-native-ios.mdx index 1c4c81b12b8..fb16681f44e 100644 --- a/docs/getting-started/react-native-ios.mdx +++ b/docs/getting-started/react-native-ios.mdx @@ -51,7 +51,7 @@ Add all of the code below to your `ios/Podfile`: platform :ios, '9.0' def flipper_pods() - flipperkit_version = '0.258.0' # should match the version of your Flipper client app + flipperkit_version = '0.259.0' # should match the version of your Flipper client app pod 'FlipperKit', '~>' + flipperkit_version, :configuration => 'Debug' pod 'FlipperKit/FlipperKitLayoutPlugin', '~>' + flipperkit_version, :configuration => 'Debug' pod 'FlipperKit/SKIOSNetworkPlugin', '~>' + flipperkit_version, :configuration => 'Debug' diff --git a/docs/getting-started/react-native.mdx b/docs/getting-started/react-native.mdx index 8692f66f2bf..0cd0ef9689a 100644 --- a/docs/getting-started/react-native.mdx +++ b/docs/getting-started/react-native.mdx @@ -34,7 +34,7 @@ Latest version of Flipper requires react-native 0.69+! If you use react-native < Android: -1. Bump the `FLIPPER_VERSION` variable in `android/gradle.properties`, for example: `FLIPPER_VERSION=0.258.0`. +1. Bump the `FLIPPER_VERSION` variable in `android/gradle.properties`, for example: `FLIPPER_VERSION=0.259.0`. 2. Run `./gradlew clean` in the `android` directory. iOS: @@ -44,7 +44,7 @@ react-native version => 0.69.0 2. Run `pod install --repo-update` in the `ios` directory. react-native version < 0.69.0 -1. Call `use_flipper` with a specific version in `ios/Podfile`, for example: `use_flipper!({ 'Flipper' => '0.258.0' })`. +1. Call `use_flipper` with a specific version in `ios/Podfile`, for example: `use_flipper!({ 'Flipper' => '0.259.0' })`. 2. Run `pod install --repo-update` in the `ios` directory. ## Manual Setup diff --git a/gradle.properties b/gradle.properties index 0c80f90ba4b..01ef674cb3d 100644 --- a/gradle.properties +++ b/gradle.properties @@ -3,7 +3,7 @@ # This source code is licensed under the MIT license found in the # LICENSE file in the root directory of this source tree. # POM publishing constants -VERSION_NAME=0.258.1-SNAPSHOT +VERSION_NAME=0.259.0 GROUP=com.facebook.flipper SONATYPE_STAGING_PROFILE=comfacebook POM_URL=https://github.com/facebook/flipper diff --git a/js/js-flipper/package.json b/js/js-flipper/package.json index 04615f282eb..f867fd514d9 100644 --- a/js/js-flipper/package.json +++ b/js/js-flipper/package.json @@ -1,7 +1,7 @@ { "name": "js-flipper", "title": "JS Flipper Bindings for Web-Socket based clients", - "version": "0.258.0", + "version": "0.259.0", "main": "lib/index.js", "browser": { "os": false diff --git a/react-native/react-native-flipper/package.json b/react-native/react-native-flipper/package.json index 1fc0e05d9b1..4a65557b0e6 100644 --- a/react-native/react-native-flipper/package.json +++ b/react-native/react-native-flipper/package.json @@ -1,7 +1,7 @@ { "name": "react-native-flipper", "title": "React Native Flipper Bindings", - "version": "0.258.0", + "version": "0.259.0", "description": "Flipper bindings for React Native", "main": "index.js", "types": "index.d.ts", From f0882300c6beab878752d53d4d70459d7d1331d3 Mon Sep 17 00:00:00 2001 From: generatedunixname89002005306973 Date: Wed, 17 Jul 2024 08:01:53 -0700 Subject: [PATCH 06/10] Flipper Snapshot Bump: v0.259.1-SNAPSHOT Summary: Releasing snapshot version 0.259.1-SNAPSHOT Reviewed By: passy Differential Revision: D59852783 fbshipit-source-id: 7b0ecebed3f1cb57ef13dfb21e408b07d9b302e1 --- docs/getting-started/android-native.mdx | 4 ++-- gradle.properties | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/getting-started/android-native.mdx b/docs/getting-started/android-native.mdx index adeb24a2626..02e17eae9f5 100644 --- a/docs/getting-started/android-native.mdx +++ b/docs/getting-started/android-native.mdx @@ -124,10 +124,10 @@ repositories { } dependencies { - debugImplementation 'com.facebook.flipper:flipper:0.258.1-SNAPSHOT' + debugImplementation 'com.facebook.flipper:flipper:0.259.1-SNAPSHOT' debugImplementation 'com.facebook.soloader:soloader:0.10.5' - releaseImplementation 'com.facebook.flipper:flipper-noop:0.258.1-SNAPSHOT' + releaseImplementation 'com.facebook.flipper:flipper-noop:0.259.1-SNAPSHOT' } ``` diff --git a/gradle.properties b/gradle.properties index 01ef674cb3d..b707f0595a6 100644 --- a/gradle.properties +++ b/gradle.properties @@ -3,7 +3,7 @@ # This source code is licensed under the MIT license found in the # LICENSE file in the root directory of this source tree. # POM publishing constants -VERSION_NAME=0.259.0 +VERSION_NAME=0.259.1-SNAPSHOT GROUP=com.facebook.flipper SONATYPE_STAGING_PROFILE=comfacebook POM_URL=https://github.com/facebook/flipper From cae289587ff652cd61d3eae965765ac09f603dc4 Mon Sep 17 00:00:00 2001 From: Luke De Feo Date: Thu, 18 Jul 2024 09:35:26 -0700 Subject: [PATCH 07/10] Fix data inspector hover state on context menu Summary: this has been irritating me for years. See test plan for the issue One other side benefit of this change is we no longer render a entire context menu per item in the inspector, there is a single context menu that updates itself when hover state changes Another benefit is removing a use of a deprecated antd api The additional context menu feature is preserved but is still using the old api sort of, since there is only 1 usage (analytics plugin which is deprecated ) this felt like a good compromise Reviewed By: antonk52 Differential Revision: D59910599 fbshipit-source-id: 2a5a379da169e5392b51952caf9791f7367034b0 --- .../src/ui/data-inspector/DataInspector.tsx | 146 ++++++++++++++---- .../ui/data-inspector/DataInspectorNode.tsx | 138 ++++------------- .../__tests__/DataInspector.node.tsx | 22 ++- .../src/ui/data-table/TableRow.tsx | 4 +- 4 files changed, 159 insertions(+), 151 deletions(-) diff --git a/desktop/flipper-plugin/src/ui/data-inspector/DataInspector.tsx b/desktop/flipper-plugin/src/ui/data-inspector/DataInspector.tsx index e3713016ff3..6e3dff96081 100644 --- a/desktop/flipper-plugin/src/ui/data-inspector/DataInspector.tsx +++ b/desktop/flipper-plugin/src/ui/data-inspector/DataInspector.tsx @@ -14,6 +14,10 @@ import React from 'react'; import {DataValueExtractor} from './DataPreview'; import {HighlightProvider, HighlightManager} from '../Highlight'; import {Layout} from '../Layout'; +import {Dropdown, MenuProps} from 'antd'; +import {_tryGetFlipperLibImplementation} from 'flipper-plugin'; +import {safeStringify} from 'flipper-plugin'; +import {getValueAtPath} from '../data-table/DataTableManager'; export type DataInspectorProps = { /** @@ -109,7 +113,9 @@ export class DataInspector extends PureComponent< filterExpanded: {}, filter: '', hoveredNodePath: undefined, - }; + } as DataInspectorState; + + isContextMenuOpen = false; static getDerivedStateFromProps( nextProps: DataInspectorProps, @@ -193,9 +199,11 @@ export class DataInspector extends PureComponent< }; setHoveredNodePath = (path?: string) => { - this.setState({ - hoveredNodePath: path, - }); + if (!this.isContextMenuOpen) { + this.setState({ + hoveredNodePath: path, + }); + } }; removeHover = () => { @@ -209,34 +217,108 @@ export class DataInspector extends PureComponent< render() { return ( - - - - - - - + { + this.isContextMenuOpen = open; + }} + trigger={['contextMenu']}> + + + + + + + + ); } + + getContextMenu = () => { + const lib = _tryGetFlipperLibImplementation(); + + let extraItems = [] as MenuProps['items']; + + const hoveredNodePath = this.state.hoveredNodePath; + const value = + hoveredNodePath != null && hoveredNodePath.length > 0 + ? getValueAtPath(this.props.data, hoveredNodePath) + : this.props.data; + if ( + this.props.additionalContextMenuItems != null && + hoveredNodePath != null && + hoveredNodePath.length > 0 + ) { + const fullPath = hoveredNodePath.split('.'); + const parentPath = fullPath.slice(0, fullPath.length - 1); + const name = fullPath[fullPath.length - 1]; + + const additionalItems = this.props.additionalContextMenuItems( + parentPath, + value, + name, + ); + + extraItems = [ + ...additionalItems.map((component) => ({ + key: `additionalItem-${parentPath}.${name}`, + label: component, + })), + {type: 'divider'}, + ]; + } + + const items = [ + ...(extraItems as []), + {key: 'copy-value', label: 'Copy'}, + ...(this.props.onDelete != null + ? [{key: 'delete-value', label: 'Delete'}] + : []), + {type: 'divider'}, + {key: 'copy-tree', label: 'Copy full tree'}, + ...(lib?.isFB ? [{key: 'create-paste', label: 'Create paste'}] : []), + ] as MenuProps['items']; + + return { + items, + onClick: (info) => { + this.isContextMenuOpen = false; + if (info.key === 'copy-value') { + if (this.state.hoveredNodePath != null) { + const value = getValueAtPath( + this.props.data, + this.state.hoveredNodePath, + ); + lib?.writeTextToClipboard(safeStringify(value)); + } + } else if (info.key === 'delete-value') { + const pathStr = this.state.hoveredNodePath as string | undefined; + this.props.onDelete?.(pathStr?.split('.') ?? []); + } else if (info.key === 'copy-tree') { + lib?.writeTextToClipboard(safeStringify(this.props.data)); + } else if (info.key === 'create-paste') { + lib?.createPaste(safeStringify(this.props.data)); + } + }, + } as MenuProps; + }; } diff --git a/desktop/flipper-plugin/src/ui/data-inspector/DataInspectorNode.tsx b/desktop/flipper-plugin/src/ui/data-inspector/DataInspectorNode.tsx index 3a099aad9a1..f24ee77649f 100644 --- a/desktop/flipper-plugin/src/ui/data-inspector/DataInspectorNode.tsx +++ b/desktop/flipper-plugin/src/ui/data-inspector/DataInspectorNode.tsx @@ -16,27 +16,20 @@ import { useEffect, useCallback, createContext, - useContext, - ReactElement, - SyntheticEvent, } from 'react'; import styled from '@emotion/styled'; import DataPreview, {DataValueExtractor, InspectorName} from './DataPreview'; import {getSortedKeys} from './utils'; import React from 'react'; import {useHighlighter, HighlightManager} from '../Highlight'; -import {Dropdown, Menu, Tooltip} from 'antd'; +import {Tooltip} from 'antd'; import {useInUnitTest} from '../../utils/useInUnitTest'; import {theme} from '../theme'; -import {tryGetFlipperLibImplementation} from '../../plugin/FlipperLib'; -import {safeStringify} from '../../utils/safeStringify'; export {DataValueExtractor} from './DataPreview'; export const RootDataContext = createContext<() => any>(() => ({})); -export const contextMenuTrigger = ['contextMenu' as const]; - const BaseContainer = styled.div<{ depth?: number; disabled?: boolean; @@ -144,9 +137,6 @@ type DataInspectorProps = { */ onExpanded?: ((path: string, expanded: boolean) => void) | undefined | null; /** - * Callback whenever delete action is invoked on current path. - */ - onDelete?: DataInspectorDeleteValue | undefined | null; /** * Render callback that can be used to customize the rendering of object keys. */ @@ -175,11 +165,6 @@ type DataInspectorProps = { * Object of properties that will have tooltips */ tooltips?: any; - additionalContextMenuItems?: ( - parentPath: string[], - value: any, - name?: string, - ) => ReactElement[]; hoveredNodePath?: string; @@ -308,7 +293,6 @@ export const DataInspectorNode: React.FC = memo( expandRoot, parentPath, onExpanded, - onDelete, onRenderName, onRenderDescription, extractValue: extractValueProp, @@ -318,12 +302,10 @@ export const DataInspectorNode: React.FC = memo( collapsed, tooltips, setValue: setValueProp, - additionalContextMenuItems, hoveredNodePath, setHoveredNodePath, }) { const highlighter = useHighlighter(); - const getRoot = useContext(RootDataContext); const isUnitTest = useInUnitTest(); const shouldExpand = useRef(false); @@ -417,22 +399,19 @@ export const DataInspectorNode: React.FC = memo( [onExpanded, expandedPaths], ); - const handleClick = useCallback(() => { - if (!isUnitTest) { - cancelIdleCallback(expandHandle.current); - } - const isExpanded = shouldBeExpanded(expandedPaths, path, collapsed); - setExpanded(path, !isExpanded); - }, [expandedPaths, path, collapsed, isUnitTest]); - - const handleDelete = useCallback( - (path: Array) => { - if (!onDelete) { + const handleClick = useCallback( + (event) => { + if (!isUnitTest) { + cancelIdleCallback(expandHandle.current); + } + if (event.buttons !== 0) { + //only process left click return; } - onDelete(path); + const isExpanded = shouldBeExpanded(expandedPaths, path, collapsed); + setExpanded(path, !isExpanded); }, - [onDelete], + [expandedPaths, path, collapsed, isUnitTest], ); /** @@ -488,7 +467,6 @@ export const DataInspectorNode: React.FC = memo( expanded={expandedPaths} collapsed={collapsed} onExpanded={onExpanded} - onDelete={onDelete} onRenderName={onRenderName} onRenderDescription={onRenderDescription} parentPath={path} @@ -498,7 +476,6 @@ export const DataInspectorNode: React.FC = memo( data={metadata.data} diff={metadata.diff} tooltips={tooltips} - additionalContextMenuItems={additionalContextMenuItems} /> ); @@ -592,78 +569,27 @@ export const DataInspectorNode: React.FC = memo( } } - function getContextMenu() { - const lib = tryGetFlipperLibImplementation(); - const extraItems = additionalContextMenuItems - ? [ - additionalContextMenuItems(parentPath, value, name), - , - ] - : []; - return ( - - {extraItems} - { - lib?.writeTextToClipboard(safeStringify(getRoot())); - }}> - Copy tree - - {lib?.isFB && ( - { - lib?.createPaste(safeStringify(getRoot())); - }}> - Create paste from tree - - )} - - { - lib?.writeTextToClipboard(safeStringify(data)); - }}> - Copy value - - {!isExpandable && onDelete ? ( - { - handleDelete(path); - }}> - Delete - - ) : null} - - ); - } - const nodePath = path.join('.'); return ( - - { - setHoveredNodePath(nodePath); - }} - onMouseLeave={() => { - setHoveredNodePath(parentPath.join('.')); - }} - depth={depth} - disabled={!!setValueProp && !!setValue === false}> - - {expandedPaths && {expandGlyph}} - {descriptionOrPreview} - {wrapperStart} - - {propertyNodesContainer} - {wrapperEnd} - - + { + setHoveredNodePath(nodePath); + }} + onMouseLeave={() => { + setHoveredNodePath(parentPath.join('.')); + }} + depth={depth} + disabled={!!setValueProp && !!setValue === false}> + + {expandedPaths && {expandGlyph}} + {descriptionOrPreview} + {wrapperStart} + + {propertyNodesContainer} + {wrapperEnd} + ); }, dataInspectorPropsAreEqual, @@ -748,7 +674,6 @@ function dataInspectorPropsAreEqual( nextProps.depth === props.depth && nextProps.parentPath === props.parentPath && nextProps.onExpanded === props.onExpanded && - nextProps.onDelete === props.onDelete && nextProps.setValue === props.setValue && nextProps.collapsed === props.collapsed && nextProps.expandRoot === props.expandRoot && @@ -761,8 +686,3 @@ function isValueExpandable(data: any) { typeof data === 'object' && data !== null && Object.keys(data).length > 0 ); } - -function stopPropagation(e: SyntheticEvent) { - //without this the parent element will receive the context menu event and multiple context menus overlap - e.stopPropagation(); -} diff --git a/desktop/flipper-plugin/src/ui/data-inspector/__tests__/DataInspector.node.tsx b/desktop/flipper-plugin/src/ui/data-inspector/__tests__/DataInspector.node.tsx index 657187239cd..1b3ba807b5a 100644 --- a/desktop/flipper-plugin/src/ui/data-inspector/__tests__/DataInspector.node.tsx +++ b/desktop/flipper-plugin/src/ui/data-inspector/__tests__/DataInspector.node.tsx @@ -45,21 +45,27 @@ test('additional context menu items are rendered', async () => { data={json} expandRoot additionalContextMenuItems={(parentPath, value, name) => { - return [ - - path={[...parentPath, name].join('->')} - , - ]; + const path = [...parentPath, name].join('->'); + return [path={path}]; }} />, ); expect(await res.queryByText('path=data')).toBeFalsy; - fireEvent.contextMenu(await res.findByText(/data/), {}); - expect(await res.findByText('path=data')).toBeTruthy; + const dataContainer = await res.findByText(/data/); + fireEvent.mouseEnter(dataContainer, {}); + fireEvent.contextMenu(dataContainer, {}); + + const contextItem = await res.findByText('path=data'); + expect(contextItem).toBeTruthy; + fireEvent.click(contextItem); + expect(await res.queryByText('path=data')).toBeFalsy; + fireEvent.mouseLeave(dataContainer, {}); //try on a nested element - fireEvent.contextMenu(await res.findByText(/awesomely/), {}); + const awesomely = await res.findByText(/awesomely/); + fireEvent.mouseEnter(awesomely, {}); + fireEvent.contextMenu(awesomely, {}); expect(await res.findByText('path=data->is->awesomely')).toBeTruthy; }); diff --git a/desktop/flipper-plugin/src/ui/data-table/TableRow.tsx b/desktop/flipper-plugin/src/ui/data-table/TableRow.tsx index 81211b10532..95d276ba1f8 100644 --- a/desktop/flipper-plugin/src/ui/data-table/TableRow.tsx +++ b/desktop/flipper-plugin/src/ui/data-table/TableRow.tsx @@ -14,7 +14,7 @@ import {DataTableColumn, TableRowRenderContext} from './DataTable'; import {Width} from '../../utils/widthUtils'; import {DataFormatter} from '../DataFormatter'; import {Dropdown} from 'antd'; -import {contextMenuTrigger} from '../data-inspector/DataInspectorNode'; + import {getValueAtPath} from './DataTableManager'; import {HighlightManager, useHighlighter} from '../Highlight'; @@ -146,7 +146,7 @@ export const TableRow = memo(function TableRow({ ); if (config.onContextMenu) { return ( - + {row} ); From 85a02568d028863fda01c6b924c77f745727220a Mon Sep 17 00:00:00 2001 From: Anton Kastritskiy Date: Thu, 18 Jul 2024 11:03:30 -0700 Subject: [PATCH 08/10] autoclose attempting to connect message after a threshold Summary: We receive a large number of support requests (examples [1](https://fb.workplace.com/groups/flippersupport/posts/1875975442883105/), [2](https://fb.workplace.com/groups/flippersupport/posts/1875240279623288/), [3](https://fb.workplace.com/groups/flippersupport/posts/1734087643738553/), [4](https://fb.workplace.com/groups/flippersupport/posts/1814898918990758/), [5](https://fb.workplace.com/groups/flippersupport/posts/1854060158407967/), [6](https://fb.workplace.com/groups/flippersupport/posts/1793369631143687/)) about hanging "attempting to connect" notification where to fix it usually takes on of two ways. * Restart laptop * Multistep 1. close app on device 2. run kill adb/idb 3. restart app on the device Instead of hanging UI lets autoclose the message and prompt user with an actionable modal Reviewed By: LukeDefeo Differential Revision: D59865309 fbshipit-source-id: e5b36fb7706be8d1f108d1f39edbb55a1f917e8c --- .../flipper-ui/src/app-connection-updates.tsx | 42 +++++++++++++++++-- 1 file changed, 38 insertions(+), 4 deletions(-) diff --git a/desktop/flipper-ui/src/app-connection-updates.tsx b/desktop/flipper-ui/src/app-connection-updates.tsx index 670913d73ee..36000b07f78 100644 --- a/desktop/flipper-ui/src/app-connection-updates.tsx +++ b/desktop/flipper-ui/src/app-connection-updates.tsx @@ -92,14 +92,48 @@ export const connectionUpdate = ( if (update.detail) { content += `\n ${update.detail}`; } + let duration = 0; + if (update.type === 'success' || update.type === 'success-info') { + duration = 3; + } else if (update.type === 'loading') { + // seconds until show how to debug hanging connection + duration = 10; + } message.open({ - key: update.app, + key: update.key, type: update.type === 'success-info' ? 'info' : update.type, content, className, - duration: - update.type === 'success' || update.type === 'success-info' ? 3 : 0, - onClick: () => message.destroy(update.key), + duration, + onClick: + update.type !== 'loading' + ? () => { + message.destroy(update.key); + } + : undefined, + onClose: () => { + // only called if closed by timeout + console.log('on close called for ', update.key); + if (update.type === 'loading') { + // TODO show conect timeout modal NEXT DIFF + console.log('show a modal with step'); + + notification.error({ + key: update.key, + message: 'App failed to connect', + description: ( +
+
To fix try the following
+
uno
+
dos
+
tres
+
+ ), + duration: 0, + onClose: () => notification.close(update.key), + }); + } + }, }); } }; From 5840e87bd1418e701db747d9ea18d02ca1e9543d Mon Sep 17 00:00:00 2001 From: Anton Kastritskiy Date: Thu, 18 Jul 2024 11:03:30 -0700 Subject: [PATCH 09/10] DIY fix connectivity modal Reviewed By: LukeDefeo, lblasa Differential Revision: D59865310 fbshipit-source-id: bcfd9fd02bb33d889efa071c1474896689372f21 --- .../flipper-ui/src/app-connection-updates.tsx | 147 +++++++++++++++--- .../src/dispatcher/flipperServer.tsx | 5 + 2 files changed, 131 insertions(+), 21 deletions(-) diff --git a/desktop/flipper-ui/src/app-connection-updates.tsx b/desktop/flipper-ui/src/app-connection-updates.tsx index 36000b07f78..786a30e5fde 100644 --- a/desktop/flipper-ui/src/app-connection-updates.tsx +++ b/desktop/flipper-ui/src/app-connection-updates.tsx @@ -8,13 +8,16 @@ */ import {css} from '@emotion/css'; -import {Button, message, notification, Typography} from 'antd'; +import {Button, message, Modal, notification, Typography} from 'antd'; import React from 'react'; import {Layout} from './ui'; +import {Dialog} from 'flipper-plugin'; +import {getFlipperServer} from './flipperServer'; type ConnectionUpdate = { key: string; type: 'loading' | 'info' | 'success' | 'success-info' | 'error' | 'warning'; + os: string; app: string; device: string; title: string; @@ -97,7 +100,7 @@ export const connectionUpdate = ( duration = 3; } else if (update.type === 'loading') { // seconds until show how to debug hanging connection - duration = 10; + duration = 30; } message.open({ key: update.key, @@ -111,29 +114,131 @@ export const connectionUpdate = ( message.destroy(update.key); } : undefined, + // NOTE: `onClose` is only called when the message is closed by antd because of `duration` + // It is not closed when we call `message.destroy(key)`. + // Thus we can use it trigger a timeout modal for hanging "attempting to connect" messages onClose: () => { - // only called if closed by timeout - console.log('on close called for ', update.key); if (update.type === 'loading') { - // TODO show conect timeout modal NEXT DIFF - console.log('show a modal with step'); - - notification.error({ - key: update.key, - message: 'App failed to connect', - description: ( -
-
To fix try the following
-
uno
-
dos
-
tres
-
- ), - duration: 0, - onClose: () => notification.close(update.key), - }); + Dialog.showModal((hide) => ( + + )); } }, }); } }; + +const styles = { + numberedList: { + listStyle: 'auto', + paddingLeft: 16, + display: 'flex', + flexDirection: 'column', + gap: 4, + } satisfies React.CSSProperties, + title: { + marginBottom: 8, + } satisfies React.CSSProperties, +}; + +function DIYConnectivityFixModal({ + app, + os, + onHide, +}: { + app: string; + os: string; + onHide: () => void; +}) { + return ( + +
+ + Connecting to {app} has timed out. + + + This is usually can be fixed in a few ways. Try the following in the + order presented. + + + Least involved + +
    +
  1. + + Completly close the app on the device + +
    2. +
  2. + +
    3. +
  3. + Launch the app on the device +
    4. +
+ + More involved + +
    +
  1. + Restart device +
    2. +
  2. + +
    3. +
+ + Most involved + + + This can be frequently fixed by restarting your computer. + +
+ + ); +} diff --git a/desktop/flipper-ui/src/dispatcher/flipperServer.tsx b/desktop/flipper-ui/src/dispatcher/flipperServer.tsx index 8118cd6d23a..bc31d325dc5 100644 --- a/desktop/flipper-ui/src/dispatcher/flipperServer.tsx +++ b/desktop/flipper-ui/src/dispatcher/flipperServer.tsx @@ -102,6 +102,7 @@ export function connectFlipperServerToStore( type: 'loading', app: client.appName, device: client.deviceName, + os: client.os, title: 'is attempting to connect...', }, troubleshootConnection, @@ -113,6 +114,7 @@ export function connectFlipperServerToStore( { key: buildGenericClientId(client), type, + os: client.os, app: client.appName, device: client.deviceName, title: 'failed to establish a connection', @@ -161,6 +163,7 @@ export function connectFlipperServerToStore( key: buildGenericClientId(client), type: 'info', app: client.appName, + os: client.os, device: client.deviceName, title: step, }, @@ -182,6 +185,7 @@ export function connectFlipperServerToStore( type: 'success', app: payload.query.app, device: payload.query.device, + os: payload.query.os, title: 'successfully connected', }, troubleshootConnection, @@ -198,6 +202,7 @@ export function connectFlipperServerToStore( key: buildGenericClientIdFromQuery(existingClient.query), type: 'success-info', app: existingClient.query.app, + os: existingClient.query.os, device: existingClient.query.device, title: 'disconnected', }, From 000af47ebae0e9e867dbd4dea445f17fe61b11bc Mon Sep 17 00:00:00 2001 From: Pascal Hartig Date: Fri, 19 Jul 2024 14:16:04 +0100 Subject: [PATCH 10/10] [ci] Update set-output syntax --- .github/workflows/nodejs.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/nodejs.yml b/.github/workflows/nodejs.yml index e16f8d179b2..e29656baaaf 100644 --- a/.github/workflows/nodejs.yml +++ b/.github/workflows/nodejs.yml @@ -20,7 +20,8 @@ jobs: node-version: ${{ matrix.node-version }} - name: Get yarn cache directory path id: yarn-cache-dir-path - run: echo "::set-output name=dir::$(yarn cache dir)" + run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT + shell: bash - uses: actions/cache@v2 id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`) with: