forem / dev-ios

DEV Community iOS App

DEV iOS 💖

This is the repo for the dev.to iOS app.

Status:

Released first version, more info: https://twitter.com/bendhalpern/status/1061323718058786822

Design ethos

We will grow to include more native code over time, but for now we are taking the approach of native shell/web views. This approach lost favor early in iOS days, but I believe it is a very valid approach these days. It is inspired by how Basecamp does things. Our tech stack is a bit different, but the ideas are the same.

https://m.signalvnoise.com/basecamp-3-for-ios-hybrid-architecture-afc071589c25

https://signalvnoise.com/posts/3743-hybrid-sweet-spot-native-navigation-web-content

https://signalvnoise.com/posts/3766-hybrid-how-we-took-basecamp-multi-platform-with-a-tiny-team

https://www.youtube.com/watch?v=SWEts0rlezA

By leveraging wkwebviews as much as possible, I think we can make this all pretty awesome and sync up with our web dev work pretty smoothly. And where it makes sense, we can re-implement certain things fully native, or build entirely native features. Life's a journey, not a destination.

Contributing

1. Fork and clone the project.
2. Build and run the project in XCode.
3. To enforce code style we're using SwiftLint which is loosely based on GitHub's Swift Style Guide. CodeClimate is enabled for this repository, so your pull request build will fail if there are linting errors!
4. To install, brew install swiftlint.
5. If you are using Xcode, add a new "Run Script Phase" (Xcode project > Build Phases > add New Run Script Phase):

if which swiftlint >/dev/null; then
  swiftlint
else
  echo "warning: SwiftLint not installed, download from https://github.com/realm/SwiftLint"
fi

This will run on build and show linting errors in Xcode. If you are using a different IDE there are alternative install methods in the SwiftLint docs. 3. Alternatively you can run $ swiftlint in the root directory.

Feedback and Pull Requests are welcome! As this is a new and constantly evolving project, please be sure to include unit tests with changes.

Thanks for your help!!!

dev-ios's Issues

Double click notifications tab should refresh

When a tab is clicked while it is the active tab, it should reload that tab. Basically this is the "refresh/go home" functionality users expect.

This behavior is defined in AppDelegate right now, and the last PR broke this. Which is fine, let's just get this behavior working properly.

I originally put this in AppDelegate and found some kind of way to get it working. Would definitely welcome better approaches or moving this to a better place.

Definition of done

Once the intended behavior works, I'm satisfied. If it also improves the code, all the better.

Smart invert not consistent

Describe the bug
Submitted by a test user: Smart invert is inverting photos (i.e. profile, cover images)

To Reproduce
Steps to reproduce the behavior:

1. Go to general -> accessibility -> display accommodations -> smart invert

Expected behavior
I believe photos shouldn't get inverted at all? Or the opposite? Regardless, some are getting inverted and some are not.

Screenshots

Terms and Conditions, Code of Conduct etc should be easy to find

The only place I can find this information is in the web footer. Should these be easier to find?

User Github link doesn't open

Describe the bug
In a comment when clicking the user Github icon, it does nothing.

To Reproduce
Steps to reproduce the behavior:

1. Go to 'A post and look a comment'
2. Click on 'Github icon which near the username if it exists'
3. Nothing happens

Expected behavior
Redirecting to user Github profile.

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS12.0.1]
• Version [e.g. 1]

Replace "user tab" smiley face with logged-in user's profile image

We currently grab user's data in order to determine which logged in view to show, thanks to @Ceri-anne's great work.

The other thing we should have is the logged in user's profile image to replace the default smiley. This should be stored and served immediately when we know who the user is.

We can access the profile_image_90 in the data we have access to. Now we just need to add it to that space in the tab bar and make it circular.

Almost ready for initial release (in fact, I'd say this is a nice-to-have, but it would be nice to have!)

Outlook/roadmap/thoughts on iOS app. We should be able to ship a beta soon!

It has been a wild few days since we made our big open source push in general.

I love the enthusiasm for this project and we're pretty close to a shippable app. It's just a lot of little things.

I have really been loving Swift and iOS but I'm still a newb, so at the moment I can't give a lot of great advice on how to develop some of this stuff. That being said, I'm still pretty confident from a work-management perspective, that the native shell, web view architecture is the right way to go for now.

Remaining work

• This app should only be useable via logged in. I think that's easier than supporting both states. Unlike the web version, there's not a lot of reasons you'd need to be logged out of your account. The wkwebviews in the app share the session so things just seem to work once the user is logged in. I'm open to different ways of accomplishing this, observing the loaded web view's cookies or contents for clues for logged in state, and then perhaps popping up a log in cue if they are not logged in? Or something else. We can experiment with this.
• The current "notification badge" polling is pretty naive and possibly inconsistent. This could be cleaned up a bit. We can also build in the infra to push to the app and we can coordinate to make sure this works from the core repo.
• I haven't even thought of push notifications, but we use Pusher in our main app, and they have a Push notification API, makes sense to look there, eh? But we can also ship a beta without push notifications.
• The constraints are possibly off for some phone sizes. I don't exactly have a great idea of how exactly those work, but the loading icons etc. should always be in the same place, about half to two-thirds up the screen, as long as it's the same for each tab.
• We are still early in the design of this, so I can't say I have the perfect spec for everything, so feel free to consider design adjustments, just don't clutter things. Look to Twitter/Instagram/etc. for UX cues, becasue our app is sort of the same.
• Any niceties we can build in along the way are super great. Surprise me!

I'll be more involved in this starting Monday, and will start to give better feedback on the whole process. In the meantime, thanks so much!

App will be rejected without a 1024x1024 logo

Describe the bug
When submitting the app to the app store, Apple will reject the app if you don't have a 1024x1024 logo.

To Reproduce
Steps to reproduce the behavior:

1. Go to Assets.xcassets in XCode
2. Click on AppIcon
3. Scroll down to AppStore iOS 1024pt
4. Missing 1024x1024 Dev.to logo.

Expected behavior
If you provide the logo, Apple will accept the app.

Screenshots

Unable to build the app in Xcode

I get 2 errors while trying to build the project :

• error: No account for team "xxxxxxxxxx". Add a new account in the Accounts preference pane or verify that your accounts have valid credentials. (in target 'DEV')
• error: No profiles for 'DEV.DEVbendevelopment' were found: Xcode couldn't find any iOS App Development provisioning profiles matching 'DEV.DEVbendevelopment'. (in target 'DEV')

Is the free apple developper account enough or do I need a paid one?

Determine how to handle notification refresh/mark as read

This may not be within the scope of just this app, but I'd like to figure this out one way or another.

Basically in the web view when the notifications page is loaded, there is a "mark as read" functionality that triggers. (A POST request to /notifications/reads).

I don't think it triggers in this app if the page refreshes in the background (this is correct) or if the tab is moved to (should probably mark as read in this case).

If you "refresh" the tab it does work, which makes sense, as the page is then accessed similarly to on the web.

Sorry if this doesn't make sense, it's hard to describe.

Pull-to-refresh on all main tab views (except Connect)

All the tabs are loaded via wkwebview, and it would be nice if user could pull to refresh this view. I imagine this can't be that hard, but I'm not sure how to pull it off. Open for anyone!

Broken onboarding flow

Describe the bug
Submitted from a testflight user:
New joiner sign up via the app didn’t save any of the interest /hashtag preferences or my bio information that I filled out a couple times. Once it saved on the initial welcome screen, It then requested it to be filled out again on each of the tab sections as if it was the first time (see attached pic). Let me know if ya need more info!

Screenshots

Smartphone (please complete the following information):
Device: iPhone10,6
iOS Version: 12.0.1

Clicking mailto links crashes the app if there is no mail app setup

Describe the bug
This is reported by someone via email; details are as-is.

I did not set mail app in my phone. I clicked your email in the app "[email protected]" app crashed. I think you don't control if mail app is set in the device. Then you are trying to open mail composer. It crashes because of nil reference.

To Reproduce
Steps to reproduce the behavior:

1. Have an iPhone with no Mail app setup
2. Visit a page with a mailto link, like https://dev.to/contact
3. Click on the mailto link
4. App should crash

Expected behavior
The app should properly handle mailto links. This might be helpful in getting to a solution:

I think you don't control if mail app is set in the device. Then you are trying to open mail composer. It crashes because of nil reference.

Smartphone (please complete the following information):

• Device: iPhone 8
• OS: 11.4.1

Proper Coding Styles and Guidelines

Is your feature request related to a problem? Please describe.
There are different coding styles, I think we should have a single guide for coding styles.

Describe the solution you'd like
Take a look at Google's Swift Style guidelines or LinkedIn

Article engagement count not consistent within the app

Describe the bug
The article engagement count ❤️ is not the same when seeing MY DEV FEED that when clicking on the post.

To Reproduce
Steps to reproduce the behavior:

1. Go to MY DEV FEED
2. Check the number of 'Article Engagement Count' for any of the articles
3. Open the specific article
4. Compare the number of 'Article Engagement Count'

Expected behavior
Article engagement count should be consistent within the app.

Screenshots

Smartphone (please complete the following information):

• Device: [iPhone7]
• OS: [iOS12.0.1]
• Version [1]

Add universal link functionality

We already have the universal link mapping on the web app, so the phone knows to open the iOS app.

But currently we are not supporting the functionality where the actual page is opened.

If I click a dev.to/ben link on the web, I'll be brought to the app, but it will just show the page I had open.

I imagine that this can be handled similarly to how we're handling opening notifications on the appropriate link. It should be fairly easy to open a specific web page given that our app is only a single wkwebview.

Preload "New Post" page

When I click to compose a new post, it seems like there's no good reason that page can't already be loaded and ready to go. Similar to when we tab between views. If it's already loaded than it's instantly ready to go, giving the expected native experience.

Clicking 'Cancel' on Twitter login page presents user with homepage without being logged in

Describe the bug
When directed to login, if the user clicks 'Cancel' they are redirected to the homepage

To Reproduce
Steps to reproduce the behavior:

1. Open app (not logged in)
2. When presented with login screen, click on 'Auth with Twitter'
3. Click on 'Cancel'
4. Click on 'Go to The DEV Community Homepage'
5. User can now browse the website

Expected behavior
Cancelling during the login stage should return the user to the initial log in page

Screenshots

Smartphone:

• Device: Simulator iPhone X
• OS: iOS12
• Version: master branch

Add haptic feedback

The app should be able to respond with haptic feedback (vibrate, etc.) where appropriate within the user experience.

But the app shouldn't be responsible for the business logic. It should simply receive instructions to vibrate or respond to any other cue.

I believe we can use webkit.messageHandlers for this on the web app side or some other approach.

Importantly, we have to define whatever the approach is and implement it. Once we define and ship this on the app side of things we can start sending signals via the web app.

iPad Support

Describe the bug
The app doesn't seem to be optimized for iPad (at least the 11" model for me)

To Reproduce

1. Rotate iPad to landscape mode
2. Launch the app.

Expected behavior
The app should rotate to landscape mode and scale to the full resolution of the screen.

Screenshots

Device Info (please complete the following information):

• Device: 2018 iPad 11"
• OS: iOS 12.1
• Version 12

Proposal for a modified design direction

I want to propose a design adjustment which simplifies the initial version of this app to be released.

I propose we remove the tabs and lean in on this being an even simpler shell of the mobile web. All navigation will be via the web version of the app.

I'm seeing the last 10% of the existing approach as possibly resulting in another 90% of work. And it's not that we couldn't push it through, but I could foresee it resulting in a sort of maintenance burden we are trying to avoid.

So I think we should go with a stripped down shell that simply offers the web view, with web navigation to everything needed and a bottom bar providing back/forward and other utility buttons (view URL I'm currently on? Open in Safari? Etc.)

We are web focused, we already have all needed functionality on the web. I think we should lean in on a leaner approach and ship something that will at least work as well as the web.

As far as native functionality, I think we should support deep linking, push notifications, and other conveniences, but mostly try to launch something as simple as possible from an implementation perspective, and I think that is what I'm describing.

I know we put in a good deal of work in the current approach, but I don't think we should fall for a sunk cost fallacy. I think we've learned a good deal about what's been difficult, what's been easy, etc.

Final thought: If we go this way, it might be plausible that React Native or Flutter would be a better approach.

Change how the user signs in by using the OS web browser instead of the webview

When doing the sign in via Github or Twitter it opens a webview but inside of the app, I would love to have it outside the app in the web browser, that way I can see my data is going directly to Github or Twitter.

(I trust Dev.to :) just thinking like a normal user).

Missing navigation after visiting 'about' or 'privacy' pages

Describe the bug
Submitted via TestFlight Feedback Email:

On initial log in page, you can scroll down and click on the links below. If you click them (e.g. about or privacy policy), there’s not way to get back to the initial page without force quitting the app.

Expected behavior
There should be a way to navigate back to the initial page without force quitting the app.

Smartphone (please complete the following information):
App Information:
App Name: DEV Community
App Version: 1.0 (1)
Installed App Version: 1.0 (1)

Device Information:
Device: iPhone10,6
iOS Version: 12.1
Language: en-GB (English (United Kingdom))
Carrier: EE
Timezone: BST
Architecture: N/A
Connection Status: WiFi
Paired Apple Watch: Apple Watch - Watch OS 5.0.1 (16R381)

Fix race condition/hacks in back button

Currently the back button is subject to certain race conditions because it "waits" to display, and can be caught in the wrong state.

A rewrite of the general back button behavior is due.

Notification won't go away on connect

Describe the bug
Notification for connect won't go away even after I navigated to other tabs. Can't refresh by pulling down the way notifications works.

To Reproduce
Not really sure how to reproduce when I can't get it to go away on my own device.

Screenshots

Smartphone (please complete the following information):

• Device: iPhone6
• OS: iOS
• Version 12.0.1

Add network awareness/offline support

Currently if the network is slow to respond, the app sort of just craps out. We should add features to detect a poor network condition and display a banner that indicates the status and gives the user the option of retrying.

Let's ship this app to beta users

We still have some issues to work out, but I feel like we should just get this out the door in Testflight and go from there.

If anybody is available to manage this process, we could pay a contractor to head this up for us if rates are reasonable. If anybody wants to officially help take this up either volunteer or paid, ping here or [email protected].

@chickdan what do you think?

Improve Image Upload & Copy/Paste

Is your feature request related to a problem? Please describe.
From a comment on dev.to:

when I try to upload an image in a comment, I’m unable to actually target and then copy the resulting url.

Describe the solution you'd like

A button to automatically copy the url to your clipboard would be fantastic!

User can get stuck if they don't login.

Describe the bug
If I don't login, click the home button and then read an article I get stuck on that article. The tab bar disappears I believe.

To Reproduce
Steps to reproduce the behaviour:
GIF of Bug

Expected behavior
Tab bar should stick around for unauthenticated users.

Opening camera crashes app

I assume this is a permissions thing. Basically the expected behavior in the web of being able to open the camera does not work here. You can select photos.

Since we're native, we could now get more clever with our use of native APIs like the camera, but I'd say we should start with just getting it to work.

Scroll indicator continues behind the navigation bar

Describe the bug
While scrolling in any screen, the scroll indicator (aka scroll bar) disappears behind the navigation bar instead of stopping below the navigation bar.

To Reproduce
Steps to reproduce the behavior:

1. Go to any screen.
2. Scroll down any percent, and then scroll back up to the top of the view.
3. The scroll indicator will now appear to continue to scroll underneath the navigation bar.

Expected behavior
The scroll indicator should appear to stop below the navigation bar.

Screenshots

Smartphone (please complete the following information):

• Device: iPhone XS
• OS: iOS 12.0.1
• Version 1.0 (1)

Additional context
This issue was only tested on the device detailed above, but is probably actual on all devices and versions of iOS.

Unable to unselect home feed tags after creating an account

Describe the bug
When you create an account, you're prompted to personalize your home feed by adding tags. If you select a tag then try to unselect it, it stays selected. If you click a tag to select it, it should unselect when you click it again.

To Reproduce
Steps to reproduce the behavior:

1. Sign in through Github on a Github account that isn't registered with dev.to.
2. Click on a tag to follow that tag, then click on that tag again to unfollow that tag and it won't work.

Expected behavior
If you click a tag to select it, it should unselect when you click it again.

Screenshots

Smartphone (please complete the following information):

• Device: iPhone XR
• OS: iOS 12.1

Change the root view controller to point the Sign In screen when the user has not started a sessions

When opening the app if I have not sign in it displays the bottom bar and then it changes with an ugly animation to the sign in screen.

Steps to reproduce the behavior:

1. Install app
2. Open the app
3. See error

What should happen is that if the user has not signed in then no loader should be displayed and it should appear immediately in the Sign In screen.

Search page design

Using the search button in the navigation goes to a list of users. This was slightly surprising as I was expecting a general search. This left me uncertain what this page would do.

The search field looks like a page heading. Only by tapping it does it become obvious that it’s a field you can type in.

I would suggest you make the search field obvious using a text field UI element, ideally pre-activated and ready to type in. Below, how about recent searches by the user, then trending searches? You could have a user search below this, if desired.

Embedded tweets do not open

Describe the bug
Embedded tweets do not open when tapping them. In other apps it either opens the twitter app or safari to the twitter page.

To Reproduce

1. Go to https://dev.to/ben/thoughts-on-github-actions-5g1i
2. Click on the embedded tweet
3. Notice it does not open

Expected behavior
Embedded tweet should open to twitter, browser, or a browser within the app.

User profile tab occasionally timesout/freezes

In using the app, I find that sometimes the user profile tab causes issues where the loading icon changes and nothing seems to help until the app is refreshed.

I imagine this has to do with the logic that we use to gather the relevant user info to display.

Add steps on how to install the app on a physical iOS device

Is your feature request related to a problem? Please describe.
Not really a problem, but a request to include steps on how to install the beta app on an actual device as opposed to in the macOS Simulator App.

Its been a long while since I've done any native development, and I had to relearn all the quirks of allowing a development stage app to be installed on my iPhone. I think this will be the case in the future if there are more people coming in from DEV.to to check out and install the app (like me 😜). I'd be happy to do this as a pull request for Hacktoberfest, if it's deemed a good idea! (This may become moot if everything is moved to TestFlight)

Describe the solution you'd like
A step by step guide in the README on how to get the app working on a physical device. (Not too bloated, links to the "gotchya" steps that have already been documented many many times on StackOverflow and similar)

Describe alternatives you've considered
This could be put somewhere else in the repository, but I think in the README makes the most sense.

Additional context
N/A

Dark Mode

Is your feature request related to a problem? Please describe.
Requested by a couple of TestFlight users...also a popular request on the web app!

Supported device orientation

The app is currently set up to support landscape orientation but there are layout/constraint issues with each tab.

Do the constraints need amending so the app still looks good in landscape? Or should landscape be removed as a supported orientation?

Issues:

• Home scene constraints need amending to match other scenes as in landscape mode, the webview and navigation bar takes up less than half of the screen.
• In portrait, the Navigation bar obscures the top menu bar from the webview. In landscape, the navigation bar isn't deep enough to cover it. Should probably hide the top menu bar anyway if it should be hidden (as is currently done in LoginViewController hideNavBar function).

Deep linking

If I open up an article from the web, it should jump to the app in the proper page.

I know we have to add proper meta tags on the site to mark this as the official app, but I'm not so sure about the logic for opening deeper links.

I'd think most links should open in the "home" tab.

Replace "write new post" icon with "settings gear" icon on profile tab

As a user I want to be able to go to my settings. I can sort of do that now by clicking "Edit my profile" on my user page but that's kind of weird. The typical settings "gear" would be expected behavior here.

We don't need the "new post" icon in two places. I think it's cool to live in the home tab.

PS. There's no obvious place to log out now. But this would be the place.

The appropriate logout button needs to be added to the web view, but the nav element can be added now.

Jump to proper tab in navigation

I'm not sure how this would work exactly, but basically if we visit /notifications from a link in a different tab, we should jump to the notifications tab.

Somehow listening for navigation and intercepting certain paths. It might be more complicated due to the JS-driven navigation in the web app instead of full page reload.

But it could be similar to how we detect back button behavior?

Open to ideas here.

broken external website link in profile

Thanks for this, @benhalpern! It should be fun using the iOS app 🍾. Just curious to know, if we used our web assets to embed in the ios app. If so, is there any ideas for a standalone PWAs?

Description
Website link provided inside the user profile is not working. When clicking the external link icon, we are not navigating to the actual website.

To Reproduce
Steps to reproduce the behavior:

1. Go to User profile
2. Click on external link icon

Screenshots

Smartphone (please complete the following information):

• Device: iPhone 6s
• OS V: iOS 12.0.1

Footer needs hiding in Search, Notifications and Profile tabs

Currently it is possible to scroll down to the web footer and then navigate the website within that tab

Dev.to link in README.md

Hello, team 👋

Currently, the dev.to link in README.md directs to a 404 for me at https://github.com/thepracticaldev/DEV-ios/blob/master. What should this link to? My assumption is it should link to the root of the repository at https://github.com/thepracticaldev/DEV-ios or https://dev.to/.

Switching out of the app, using the Camera app and switching back crashes DEV app

Describe the bug
This is reported by someone via email; details are as-is.

I was writing reply a thread. I press home button and I opened the camera app then I took a photo. After returning back to the app, all I've written in uitextfield was gone. In fact app restarted itself. But If I go home screen from the app without doing anyting there, then returning back to the app, there is no problem.

To Reproduce
Steps to reproduce the behavior:

1. Open the DEV app
2. Go to an article
3. Type a comment in the comment text field
4. Go to the home screen
5. Open the camera app
6. Take a photo
7. Switch back to DEV app
8. Text field is erased and DEV app restarts

Expected behavior
Ensure that leaving text in the comment field and doing the following will not wipe the text field nor restart the app:

• navigating to the home screen and back
• navigating to the home screen, opening the camera app (or any other app) and back
• navigating to the home screen, doing something in a different app (take a photo, send a text, etc) and back

Smartphone (please complete the following information):

• Device: iPhone 8
• OS: 11.4.1

Saving an Image Crashes the App

I tried to save an image from a comment so I could print it and pin it up in my work area. The app crashes after clicking the Save Image action.

Copy works just fine.

Edit: Using the TestFlight version.

_{Sent with GitHawk}

Navigation bar disappears when accessing to a story

If a not signed in user access to a story the navigation disappears.

Steps to reproduce the behavior:

1. Open the app
2. Scroll down and tap Home button
3. Access story
4. See error

Expected behavior
The navigation bar should always be present when accessing a story.

Launch and going forward

Hey folks. We launched a basic first version of the app.

This meant sort of changing gears and changing a lot of the code. So I am going to close a bunch of issues for now.

I think building on the current approach is the right way forward, but if anyone wants to experiment with alternatives along the lines of what we had been working on, I think we're super willing to support that.

Otherwise folks can have an impact by contributing to the current mothership.

More thoughts to follow as we get more clarity and experience.

Happy coding ❤️

Missing navigation when directed to oAuth page

Describe the bug
When I click a login method (via twitter or github) I'm brought to their respective login pages, but if I change my mind (i.e. I clicked on github but want to use twitter instead), there's no way for me to navigate back to the previous page.

Expected behavior
I should be able to navigate back to the DEV login page.

Native iOS notifications

Well done on releasing this first beta version! Very happy to participate.

I am submitting this issue regarding notifications — although I am quite unaware of its technical feasibility atm, and not even sure about whether this fits the scope of the beta testing.

Is your feature request related to a problem? Please describe.

However, I expected the app to support native notifications. For example, I still have to enter the app to see the number of notifications, and there are no alerts when a new notification is received.

Describe the solution you'd like

• Display the number of notifications on the app icon
• Fire an alert when a new notification is received, with a descriptive text.
• Allow to customise these behaviors through the standard iOS notifications settings.

Additional context

I was testing your app through the TestFlight program. :-)