Note: This contribution involves two repositories but I will emphasize only one. The other one will be mentioned for references.
https://github.com/Steemia/Steemia
https://github.com/Steemia/ionic-img-viewer
Steemia is a social network app running over the Steem Blockchain. This app will provide the users an enriched user experience plus features commonly encountered in a casually used social media. The goal of this project is to give the community a mobile app where they can do their daily activity in the blockchain.
As mentioned in this issue https://github.com/Steemia/Steemia/issues/86, the preview mode was not working when the creation post page was opened from the "What's on your mind?" button. This issue was caused by a desynchronization of the logic with the UI. In order to solve this, I had to force Angular to detect changes whenever the preview page was activated.
https://github.com/Steemia/Steemia/commit/41d22b8fb053668bcc16a94889c2a291a5589a75
I saw this feature in this post: https://steemit.com/utopian-io/@rufans/ideas-for-steemia-app-make-tags-clickable-option-to-zoom-download-images-and-deposit-and-withdrawal-button-for-other-coins but sadly it was not accepted. However, accepted or not, I do take in mind each suggestion to make better Steemia app. So, I decided to create this feature.
In order to achieve this feature, I had to fork an old Ionic plugin and modify it to satisfy my criteria (having toolbar buttons such as social sharing):
https://github.com/Steemia/ionic-img-viewer/commit/5fdb97bd78e0b6a3f746979bf79a44fcb5af0d54
Also, in the main project, I had to query all the images of the post to add an event listener for any click in the image. Since the data from the post is dynamic and unpredictable, I had no way of sending Angular-rendered code to the client side and re-render there due to security concerns. So, I ended up doing front-end manipulations:
https://github.com/Steemia/Steemia/commit/825a0b539c86817c2aa8aa6523b89068a02e0dda
Note: You can pinch in/out the image to make zoom or double tap it :D
This feature was reported as a bug but I added it to the roadmap and decided to develop it. https://github.com/Steemia/Steemia/issues/78 Basically, when you tap a tag in any post, it will dismiss all the opened pages and will set this tag to the app to show content related to this tag.
https://github.com/Steemia/Steemia/commit/ce01ee51287325cb73119fdb7af89d472d148522
After making the images clickable, I decide to let the user share these images in social media. When you press the share button in the modal view, it will share the image itself instead of the URL.
In the post details page, icons were having the wrong color when the dark mode is activated. It was resolved by adding extra CSS rules to set the correct one.
https://github.com/Steemia/Steemia/commit/56d6429e534141612dc49e3213e0f904b52e5b7b
For the user's activity endpoint, I added 3 retries before rendering an empty response. The user will have three chances to get the data (it is useful for slow internet connections and/or intermittent internet).
https://github.com/Steemia/Steemia/commit/fb7558e9254d74e49f332eeb74b0b273666798c0
Some dependencies were not in used making the app bigger without any reason. I have decided to remove them and also, I found a duplicated dependency: Moment.js. We were not using the pipe at all so I decided to better use the method from the utility provider and remove one of the dependency.
https://github.com/Steemia/Steemia/commit/6e9290767dd9929b119b6650d22609646fd7ff58
https://github.com/Steemia/Steemia/commit/a5270982d07c4266d8401949dcf866f967dc8194
Before, I was using a factory in the settings page to change the app language globally. However, while it was working as expected, it wasn't able to change the language of the drawer since it belongs to another factory. To solve this issue, I created a Subject (it is all about RxJs) which I can subscribe to and modify in any page. The root page of the app will listen for changes in this Subject and will update the language based on the value of the Subject. By doing this, I was able to remove the settings page factory and end up with only one factory in the root page of the app.
https://github.com/Steemia/Steemia/commit/01dd147b806ee7b17142eccc2b2bb016dcb76748
Before, I was sending the translated string directly to the component. However, this translation is not reactive. When it is translated, that's it. It cannot be changed unless you send another instant translate. To solve this, I used the translate pipe directly at the component and I just send the key to translate from the root component to the drawer.
https://github.com/Steemia/Steemia/commit/f3a254bb680c3afec411c62c2957e608963a8d4c
As usual, I do some code cleanup to remove unused variables, dependencies, and/or functions.
https://github.com/Steemia/Steemia/commit/1ef0aa43291ef6119844e52c0dd6af77f09a2fe6
Feel free to contribute to Steemia project by forking our repo and sending us a Pull Request.
Feel free to download Steemia on Google Play and soon on the App Store :D
