0nom4d/guardiandock

GuardianDock is a mobile app developed with Flutter for IOS and Android that allows Destiny users to check their stats and news about the game.

GuardianDock

Your stats provided by Guardians for Guardians

GuardianDock is a multi-function app for Destiny 2.

GuardianDock goal is to provide a Destiny 2 player to access his stats at the same place:

• PVE Stats (Strikes, Regular and Grandmaster Nightfalls)
• PVP Stats (Crucible, Iron Banner, Trials Of Osiris)
• Raid / Dungeon Stat

History

GuardianDock is an old school project developed with 2 friends: EternalRat and TrueBabyChaise.

The project was a React Native app connected with random APIs for Call Of Duty: Modern Warfare (2019) for Warzone, Fortnite and Destiny 2.

The project knew a first wave of refactoring that I conducted alone but I didn't do much because I tried to make the app with TypeScript and React Native (again).

Author

• Arthur Adam - 0Nom4D

Contributors

guardiandock's Issues

RSS News Articles

• Make a request to the Bungie API to get the latest news of Destiny (Endpoint: https://www.bungie.net/Platform/Content/Rss/NewsArticles/0?includebody=true&lc=fr where 0 is the pagination index and fr the news locale)
• Display the news articles as a list
• Test the RSS news fetching and display using Flutter tests

Folder architecture

Persistent Search Bar

With the NewsArticle from the RSS api endpoint on the home view, the search bar should always be available for the user. Thus, we need to implement slivers.

• Implement a CustomScrollView
• Implement a PersistentSliverHeader for Persistent Search Bar
• User should be able to scroll through HomeView without using ListView.builder

User Stat Display - Page header

Now that I handled most of the things I wanted to handle such as API errors, maintenances, API testing with Insomnia and design analysis for the app, I'm going to begin the user's statistics display.

For the header

The stat display page header must display:

• The chosen user's id
• The platform he has played on (only handling XBOX, PlayStation, Steam, Blizzard and Stadia)

• The library I'm using for the icons doesn't have the Blizzard launcher icon so I'm going to use the Activision icon for the moment.

• The name of his clan.

• Maybe this clan thing will be integrated in the app but it will be later for obvious reasons.

More informations could be displayed such as titles but I'm not such about that. I'll change that issue if I change my mind.

Build CI

Must build app for IOS and Android

Testing CI

API down handling

During the last months, Bungie API has been downed multiple times. Since the users should be notify for API health status, the app should evolve to provide informations about these errors.

Thus, I need to implement a way to provide informations about the situation and a way to avoid API calls that will systematically return an 500 error.

• Check if initial Manifest API call returns a 500 error
• If Manifest API call returns 500 error, cancel every API call made from app
• If Manifest API call returns 500 error, show a constant error message saying that API is disabled

App Theme

Need to create a Destiny Theme with fonts and colors

Bungie API Basic Stat Request

Made a basic Bungie API Request

• Manifest Request
• Basic Stat Request

Get Destiny Activity Definitions

• Make request to fetch data for a specific activity hash

• Make request to fetch data about activity place
• Make request to fetch data about destination
• Make request to fetch data about activity type

• Make request to fetch data for a specific character data

• Make request to fetch data about character race
• Make request to fetch data about character gender
• Make request to fetch data about character class

• Make request to fetch data for Commendations and Guardian Ranks

Build CI Artifact

On the Build CI for IOS and Android, the CI should now:

• Upload .apk file as artifact
• Upload .ipa file as artifact

Article Layout with Tables

I implemented the layout for articles using the Flutter widget from HTML package.

Layout issue

When using this package, I found an issue in my layout when I tested layout with a table.

This issue results in a pixel overflow when the table is built. This also cancels the ability for the user to scroll.

Potential fixes

• Find a new way of displaying the tables
• Try to implement horizontal scroll for tables

Better future handling in home view

Current issue

When launching the app, the user will land on the home view. When created the home view has this behaviour:

GuardianDock/lib/src/views/home_view.dart

Lines 18 to 47 in 336b2e7

	class _HomeViewState extends State<HomeView> {
	List<NewsArticle> fetchedArticles = [];
	bool isLoadingNewsArticle = false;
	Future<void> getManifest() async => await GetIt.I<ApiClient>().getManifest();
	void getNewsArticles() async {
	setState(() {
	isLoadingNewsArticle = true;
	});
	fetchedArticles = await GetIt.I<ApiClient>().rss.getLatestArticles('fr');
	setState(() {
	isLoadingNewsArticle = false;
	});
	}
	@override
	void initState() {
	super.initState();
	getNewsArticles();
	}
	@override
	Widget build(BuildContext context) {
	return FutureBuilder(
	future: getManifest(),
	builder: (BuildContext context, AsyncSnapshot<void> snapshot) {

• First, we init the state of our view.
• Then, we're calling an async callback fetching the articles from the Bungie API.
• Finally, we're calling a FutureBuilder with a Future<void> callback directly with the callback.

This triggers the getManifest() callback twice, making the CircularProgressIndicator appear twice in a row.

In order to comply with Flutter guidelines and to fix this unexpected behaviour, I need to follow the following guideline:

"The future must have been obtained earlier, e.g. during State.initState, State.didUpdateWidget, or State.didChangeDependencies. It must not be created during the State.build or StatelessWidget.build method call when constructing the FutureBuilder. If the future is created at the same time as the FutureBuilder, then every time the FutureBuilder's parent is rebuilt, the asynchronous task will be restarted."

This guideline states that the Future callback directly called from the build method should be created inside the initState method.

Fix

In order to fix this behaviour, I'm going to do the following:

• Create a Future variable.

This variable should be set as a late variable in order to be created only inside the initState method.

• "Combining" the 2 Future callback that I'm using by implementing the Future.wait(List) function

This function waits for the number of futures inside the future list and returns a future waiting for both callback to end.

• Calling my future should not display the CircularProgressIndicator loading the Manifest twice but only once

Generate Code Documentation

App Local Storage

Add local storage to app for player search

Player search

User can search for his Bungie gamertag from the interface

Test coverage threshold

When working on that project, I wrote CIs. One for unit testing and the other for build test for Android and iOS.

Unfortunately, I didn't implemented a coverage threshold to avoid code to be not tested enough. This issue should solve the problem with a threshold coverage up to 80%.

• If coverage is lower than 80%, CI must fail.
• If coverage is 80% or higher, CI must succeed.

Link Bungie Account with app

• Handle Bungie API oAuth2 connexion
• Store tokens into Bungie API
• Reconnect user when app is closed / suspended / terminated

Display News Articles content

• When a news article item is clicked, the app should send the user on a new page, showing the article, he's reading
• The user should be able to go back to the previous page

Test CI Artifacts

After Test CI, the CI should:

• Upload the tests results as artifacts
• Fail the run if the test coverage is lower than 85
• Show the tests coverage percent

Get the Bungie API Manifest

• Request https://www.bungie.net/Platform/Destiny2/Manifest and store the Manifest

CI Secrets

Feature

In order to build a truly functional app for Android and iOS, the build CIs need to have access to the Bungie API Key I'm using.

Unfortunately, at this moment, the API key doesn't have any value in any version of the build application.

Thus, I need to implement the API key inside the build CI. This implement should at least be a bit secure so I'll use the Github Actions secrets as a first secure implementation.

• Add API key as a secret
• Implement API key inside the flutter build apk / ipa commands

Router Setup

Using GoRouter:

• Setup router
• Setup routes
• Prepare parametric routes

Articles Pagination

• Allowing the user to fetch more posts when scrolling down

Store Bungie Manifest

Font Setup

Create README