Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: improve app creation realtime management #1931

Merged
merged 1 commit into from
Apr 27, 2023

Conversation

acezard
Copy link
Contributor

@acezard acezard commented Apr 24, 2023

Fix AppTile not updating when app state changes from 'installing' to 'ready'

Issue:

The AppTile component was not correctly updating when an app's state changed from 'installing' to 'ready'. This resulted in the app icon staying as a placeholder forever in persistent scenarios (native).

Solution:

To resolve this issue, we introduced a new wrapper component, AppTileWrapper, responsible for managing the app's state and fetching the app's information when the state changes from 'installing' to 'ready'. The AppTileWrapper component utilizes a useEffect hook to detect the change in the app's state and fetch the updated app information accordingly.

When the app's information is unavailable (i.e., the app is in the 'installing' state), AppTileWrapper renders a loading icon using the SquareAppIcon component. Once the app's state changes to 'ready' and the information is fetched, AppTileWrapper renders the AppTile component, displaying the app icon with a link to the app.

Additionally, we updated the test suite to cover the new component behaviour, ensuring that the AppTile is rendered when the app is in the 'ready' state and updates when the app's state transitions from 'installing' to 'ready'.

With these changes, the AppTile component now correctly updates its state and displays the correct information when an app's state changes from 'installing' to 'ready'.

Video example:

Android.Emulator.-.Nexus_5X_API_30_5554.2023-04-24.17-29-26.mp4

@bundlemon
Copy link

bundlemon bot commented Apr 24, 2023

BundleMon

Files updated (2)
Status Path Size Limits
app/home.(hash).js
41.52KB (+249B +0.59%) 42KB
intents/home.(hash).js
32.98KB (+35B +0.1%) 35KB
Unchanged files (11)
Status Path Size Limits
vendors/home.(hash).js
1.2MB 1.5MB
services/softDeleteOrRestoreAccounts/home.js
480.21KB 487KB
services/updateAccounts/home.js
456.13KB 464KB
services/deleteAccounts/home.js
318.26KB 500KB
services/myselfFromIdenties/home.js
233.94KB 235KB
services/polyfillFetch/home.js
98.39KB 99KB
vendors-home.(hash).(hash).min.css
34.07KB 35KB
services/attributesHelpers/home.js
15.13KB 16KB
app-home.(hash).min.css
13.65KB 14KB
intents-home.(hash).min.css
5.08KB 6KB
intents/index.html
501B 1KB

Total files change +286B +0.01%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

@acezard acezard force-pushed the fix--improve-app-creation-realtime-management branch 2 times, most recently from 02e0c55 to 8e2fcae Compare April 25, 2023 07:32
@acezard acezard requested a review from Crash-- April 25, 2023 07:34
@acezard acezard marked this pull request as ready for review April 25, 2023 07:34
}

export default translate()(AppTile)
export default translate()(AppTileWrapper)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tu peux dégager le hoc pour utiliser un useI18n()

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done ✅

src/queries.js Outdated

export const fetchAppInfo = async (appId, client) => {
const appQuery = Q('io.cozy.apps').getById(appId)
const { data } = await client.query(appQuery, { as: 'fetchAppInfoReady' })
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tu ne peux pas appeler ton alias (as) ainsi parce que tout le cache de cozy-client est basé sur ce as...

https://github.com/cozy/cozy-guidelines/#naming-of-queries

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Corrigé ✅

Introduce AppTileWrapper component
to handle installing state on realtime app installation
@acezard acezard force-pushed the fix--improve-app-creation-realtime-management branch from 8e2fcae to 7fa57fd Compare April 27, 2023 13:13
@acezard acezard requested a review from Crash-- April 27, 2023 13:15
@acezard acezard merged commit f1af449 into master Apr 27, 2023
@acezard acezard deleted the fix--improve-app-creation-realtime-management branch April 27, 2023 13:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants