Course tab bar from the bottom of the screen move to the top

[eyatsenkoperpetio]

In course screen removed tab bar and create new sliding top tab bar

add to configuration:

UI_COMPONENTS:
COURSE_TOP_TAB_BAR_ENABLED: true

[miankhalid]

@eyatsenkoperpetio can you add a brief description of what this PR is accomplishing? (along with some screenshots/videos of the updated behavior)

also, it'll be great if you can link the PR with an issue on the Roadmap that its addressing, thanks!

[eyatsenkoperpetio]

Screen.Recording.2023-11-30.at.09.37.38.mov

[miankhalid]

@eyatsenkoperpetio it'll be great if you can add all the relevant info to the PR's description instead of separate comments.

[saeedbashir]

In the navbar overhaul, when we moved the course menu bar (bottom bar) to the top, we actually fixed the course header (containing course name, organization, end date, etc.) for all the tabs and positioned the menu bar (top bar) below the course header view.

In this PR, the course menu bar simply moved to the top without changing the behavior or course header view. @moeez96 I'm not sure what path we will be following here to achieve the current behavior (edX app behavior) for the course dashboard.
cc @miankhalid @touchapp

[moiz994]

@saeedbashir imo we should follow the current edX design pattern. Schema is working on the design for this following the prod edX app design pattern but it isn't yet complete. Would it cause any kind of issues if we merge the menu bar before the change in the course header?

[saeedbashir]

Would it cause any kind of issues if we merged the menu bar before the change in the course header?

@moiz994 It won't cause any issues, but I'm not sure what the design team is thinking or how we will be going with the new design. I'm waiting for a design response on the attached issue to clarify the requirements.

[touchapp]

Hey @saeedbashir can you show the updates you have made to the header? Perhaps make a similar video as @eyatsenkoperpetio ?

[saeedbashir]

Hey @saeedbashir can you show the updates you have made to the header? Perhaps make a similar video as @eyatsenkoperpetio ?

@touchapp The header is completely redesigned; for this PR, what we can do is we can use the existing header (course image and info) but make it consistent across all the tabs and move the tabs below the course image. Thoughts?
I'm attaching the video from the edX production app.

Note: Given that the cross button (top right) would be replaced with the back arrow on top left, because we aren't following presentation mode in the new app.

RPReplay_Final1702016334.MP4

[miankhalid]

Not sure what's happening here. Multiple folks have approved the PR but:

1. there's an active discussion going on in the linked issue [iOS] Move Course menu from bottom to top #154
2. plus there's this item that needs a response as well: Course tab bar from the bottom of the screen move to the top #181 (comment)

[volodymyr-chekyrta]

Tests failed because of timeout.
Re-runed pipeline, let's see.

[volodymyr-chekyrta]

Not sure what's happening here. Multiple folks have approved the PR but:

1. there's an active discussion going on in the linked issue [iOS] Move Course menu from bottom to top #154
2. plus there's this item that needs a response as well: Course tab bar from the bottom of the screen move to the top #181 (comment)

@touchapp @rnr
Code looks good to me, but can someone please react to Khalid's message?

[miankhalid]

@moiz994 @marcotuts what's the decision on this? should we go ahead with these changes? or dismiss this PR?

[moiz994]

@miankhalid as per the last design sync, the design for the course dashboard is still in progress and we could not make a final decision on the way forward for it. If this is a feature flag-based implementation, I'd say go ahead with merging it for now.