Skip to content

Commit

Permalink
feat: add navigation bar
Browse files Browse the repository at this point in the history
[ignore-commit-lint]
  • Loading branch information
Ahmed-Naguib93 committed Dec 17, 2024
1 parent c5b5ece commit 0057e24
Show file tree
Hide file tree
Showing 9 changed files with 228 additions and 42 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@

import Core
import SwiftUI
import HorizonUI

struct DashboardView: View {
@ObservedObject private var viewModel: DashboardViewModel
Expand Down Expand Up @@ -50,53 +51,17 @@ struct DashboardView: View {
}
}
}
.navigationBarItems(leading: nameLabel)
.navigationBarItems(trailing: navBarIcons)
.navigationBarItems(leading: HorizonUI.NavigationBar.Leading(title: "Hi, Horizon App"))
.navigationBarItems(trailing: HorizonUI.NavigationBar.Trailing(onEvent: viewModel.onEvent))
.scrollIndicators(.hidden, axes: .vertical)
.background(Color.backgroundLight)
.onFirstAppear { viewModel.viewController = viewController}
}

private var nameLabel: some View {
Size16RegularTextDarkestTitle(title: viewModel.title)
}

private var navBarIcons: some View {
HStack(spacing: 0) {
Button {
viewModel.notebookDidTap(viewController)
} label: {
Image(systemName: "book.closed")
.tint(.backgroundDark)
.frame(width: 40, height: 40)
.background(Color.backgroundLightest)
.clipShape(.circle)
.shadow(color: .backgroundDark, radius: 2)
}

Button {
viewModel.notificationsDidTap()
} label: {
Image(systemName: "bell.badge")
.tint(.backgroundDark)
.frame(width: 40, height: 40)
.background(Color.backgroundLightest)
.clipShape(.circle)
.shadow(color: .backgroundDark, radius: 2)
}

Button {
viewModel.profileDidTap()
} label: {
Image(systemName: "person")
.tint(.backgroundDark)
.frame(width: 40, height: 40)
.background(Color.backgroundLightest)
.clipShape(.circle)
.shadow(color: .backgroundDark, radius: 2)
}
}
}

@ViewBuilder
private func moduleView(course: HCourse) -> some View {
if let module = course.currentModule, let moduleItem = course.currentModuleItem {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
import Combine
import Core
import Foundation
import HorizonUI

final class DashboardViewModel: ObservableObject {
// MARK: - Outputs
Expand All @@ -27,6 +28,11 @@ final class DashboardViewModel: ObservableObject {
@Published private(set) var title: String = "Hi, John"
@Published private(set) var courses: [HCourse] = []

// MARK: - Input

var onEvent: (HorizonUI.NavigationBar.Trailing.Event) -> Void = { _ in}
var viewController: WeakViewController = .init()

// MARK: - Private variables

private var subscriptions = Set<AnyCancellable>()
Expand Down Expand Up @@ -55,15 +61,35 @@ final class DashboardViewModel: ObservableObject {
.map { "Hi, \($0)" }
.replaceError(with: "")
.assign(to: &$title)

configNavigationBarEvents()
}

// MARK: - Inputs

func notebookDidTap(_ viewController: WeakViewController) {
func notebookDidTap() {
router.route(to: "/notebook", from: viewController)
}

func notificationsDidTap() {}

func profileDidTap() {}
func mailDidTap() {}

// MARK: - Private Functions

private func configNavigationBarEvents() {
onEvent = { [weak self] event in
guard let self else {
return
}
switch event {
case .mail:
mailDidTap()
case .notebook:
notebookDidTap()
case .notification:
notificationsDidTap()
}
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
{
"images" : [
{
"filename" : "menu_book_notebook.svg",
"idiom" : "universal"
}
],
"info" : {
"author" : "xcode",
"version" : 1
},
"properties" : {
"template-rendering-intent" : "template"
}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
//
// This file is part of Canvas.
// Copyright (C) 2024-present Instructure, Inc.
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU Affero General Public License as
// published by the Free Software Foundation, either version 3 of the
// License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Affero General Public License for more details.
//
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
//

import SwiftUI
public extension HorizonUI.NavigationBar {
struct Storybook: View {
public var body: some View {
VStack {

}
.navigationBarItems(leading: HorizonUI.NavigationBar.Leading(title: "Hi HorizonUI"))
.navigationBarItems(trailing: HorizonUI.NavigationBar.Trailing(onEvent: { _ in }))
.navigationTitle("NavigationBar")
}
}
}

#Preview {
HorizonUI.NavigationBar.Storybook()
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
//
// This file is part of Canvas.
// Copyright (C) 2024-present Instructure, Inc.
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU Affero General Public License as
// published by the Free Software Foundation, either version 3 of the
// License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Affero General Public License for more details.
//
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
//

import SwiftUI

public extension HorizonUI.NavigationBar {
struct Leading: View {
let title: String

public init(title: String) {
self.title = title
}

public var body: some View {
Text(title)
.foregroundStyle(Color.huiColors.text.title)
.huiTypography(.p3)
.padding(.huiSpaces.primitives.mediumSmall)
.background(Color.huiColors.surface.pageTertiary)
}
}
}

#Preview {
HorizonUI.NavigationBar.Leading(title: "HorizonUI")
}

Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
//
// This file is part of Canvas.
// Copyright (C) 2024-present Instructure, Inc.
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU Affero General Public License as
// published by the Free Software Foundation, either version 3 of the
// License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Affero General Public License for more details.
//
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
//

import SwiftUI

public extension HorizonUI.NavigationBar {
struct Trailing: View {
public enum Event {
case mail
case notebook
case notification
}

private let onEvent: (Event) -> Void

public init(onEvent: @escaping (Event) -> Void) {
self.onEvent = onEvent
}

public var body: some View {
HStack(spacing: .zero) {
Button {
onEvent(.notebook)
} label: {
Image.huiIcons.menuBookNotebook
.dropShadow()
}

Button {
onEvent(.notification)
} label: {
Image.huiIcons.notificationsUnread
.dropShadow()
}

Button {
onEvent(.mail)
} label: {
Image.huiIcons.mail
.dropShadow()
}
}
}
}
}

#Preview {
HorizonUI.NavigationBar.Trailing { _ in }
}

fileprivate extension HorizonUI.NavigationBar.Trailing {
struct DropShadowModifire: ViewModifier {
func body(content: Content) -> some View {
content
.foregroundStyle(Color.huiColors.icon.default)
.frame(width: 44, height: 44)
.background {
Rectangle()
.fill(Color.huiColors.surface.pageSecondary)
.huiCornerRadius(level: .level6)
.huiElevation(level: .level4)
}
}
}
}

fileprivate extension View {
func dropShadow() -> some View {
modifier(HorizonUI.NavigationBar.Trailing.DropShadowModifire())
}
}

public extension HorizonUI {
struct NavigationBar {}
}
Original file line number Diff line number Diff line change
Expand Up @@ -416,6 +416,7 @@ public extension HorizonUI {
let circle = Image(.circle)
let ai = Image(.ai)
let aiFilled = Image(.aiFilled)
let menuBookNotebook = Image(.menuBookNotebook)

func allImages() -> [Image] {
let mirror = Mirror(reflecting: self)
Expand Down
4 changes: 3 additions & 1 deletion packages/HorizonUI/Sources/HorizonUI/Sources/Storybook.swift
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,9 @@ public struct Storybook: View {
NavigationLink {} label: {
Text("Cards").tint(Color.black)
}
NavigationLink {} label: {
NavigationLink {
HorizonUI.NavigationBar.Storybook()
} label: {
Text("Navigation").tint(Color.black)
}
}
Expand Down

0 comments on commit 0057e24

Please sign in to comment.