| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480 |
- //
- // DashboardView.swift
- // App for Indeed
- //
- import Cocoa
- final class DashboardView: NSView {
- private enum Theme {
- static let pageBackground = NSColor(calibratedWhite: 0.02, alpha: 1)
- static let chromeBackground = NSColor(calibratedWhite: 0.04, alpha: 1)
- static let sidebarBackground = NSColor(calibratedWhite: 0.07, alpha: 1)
- static let mainHostBackground = NSColor(calibratedWhite: 0.06, alpha: 1)
- static let selectionFill = NSColor(calibratedWhite: 1, alpha: 0.1)
- static let cardBackground = NSColor(calibratedWhite: 0.11, alpha: 1)
- static let toggleBackground = NSColor(calibratedWhite: 0.16, alpha: 1)
- static let primaryText = NSColor(calibratedWhite: 0.96, alpha: 1)
- static let secondaryText = NSColor(calibratedWhite: 0.62, alpha: 1)
- static let tertiaryText = NSColor(calibratedWhite: 0.48, alpha: 1)
- static let proCardFill = NSColor(calibratedRed: 0.1, green: 0.09, blue: 0.12, alpha: 1)
- static let proCardBorder = NSColor(calibratedWhite: 1, alpha: 0.09)
- static let proAccent = NSColor(calibratedRed: 0.98, green: 0.82, blue: 0.38, alpha: 1)
- static let proCTABackground = NSColor(calibratedWhite: 0.97, alpha: 1)
- static let proCTAText = NSColor(calibratedWhite: 0.05, alpha: 1)
- }
- private let contentStack = NSStackView()
- private let documentContainer = NSView()
- private let chromeContainer = NSView()
- private let sidebar = NSStackView()
- private let mainHost = NSView()
- private let mainOverlay = NSStackView()
- private let greetingLabel = NSTextField(labelWithString: "")
- private let subtitleLabel = NSTextField(labelWithString: "")
- private let searchCard = NSView()
- private let searchIcon = NSImageView()
- private let searchField = NSTextField()
- private let scrollView = NSScrollView()
- private var currentSidebarItems: [SidebarItem] = []
- private var selectedSidebarIndex: Int = 0
- override init(frame frameRect: NSRect) {
- super.init(frame: frameRect)
- setupLayout()
- }
- required init?(coder: NSCoder) {
- super.init(coder: coder)
- setupLayout()
- }
- override func layout() {
- super.layout()
- updateDocumentLayout()
- }
- func render(_ data: DashboardData) {
- greetingLabel.stringValue = "Welcome"
- subtitleLabel.stringValue = data.subtitle
- currentSidebarItems = data.sidebarItems
- if selectedSidebarIndex >= currentSidebarItems.count {
- selectedSidebarIndex = max(0, currentSidebarItems.count - 1)
- }
- configureSidebar()
- updateDocumentLayout()
- }
- private func setupLayout() {
- wantsLayer = true
- layer?.backgroundColor = Theme.pageBackground.cgColor
- scrollView.translatesAutoresizingMaskIntoConstraints = false
- scrollView.hasVerticalScroller = true
- scrollView.drawsBackground = false
- addSubview(scrollView)
- contentStack.orientation = .horizontal
- contentStack.spacing = 20
- contentStack.translatesAutoresizingMaskIntoConstraints = false
- contentStack.alignment = .height
- contentStack.edgeInsets = NSEdgeInsets(top: 24, left: 24, bottom: 24, right: 24)
- documentContainer.translatesAutoresizingMaskIntoConstraints = true
- documentContainer.autoresizingMask = [.width]
- documentContainer.frame = NSRect(x: 0, y: 0, width: 1040, height: 900)
- chromeContainer.translatesAutoresizingMaskIntoConstraints = false
- chromeContainer.wantsLayer = true
- chromeContainer.layer?.backgroundColor = Theme.chromeBackground.cgColor
- chromeContainer.layer?.cornerRadius = 0
- documentContainer.addSubview(chromeContainer)
- chromeContainer.addSubview(contentStack)
- scrollView.documentView = documentContainer
- sidebar.orientation = .vertical
- sidebar.spacing = 10
- sidebar.distribution = .fill
- sidebar.alignment = .leading
- sidebar.wantsLayer = true
- sidebar.layer?.backgroundColor = Theme.sidebarBackground.cgColor
- sidebar.layer?.cornerRadius = 16
- sidebar.edgeInsets = NSEdgeInsets(top: 18, left: 14, bottom: 18, right: 14)
- sidebar.translatesAutoresizingMaskIntoConstraints = false
- mainHost.translatesAutoresizingMaskIntoConstraints = false
- mainHost.wantsLayer = true
- mainHost.layer?.backgroundColor = Theme.mainHostBackground.cgColor
- mainHost.layer?.cornerRadius = 16
- mainHost.layer?.masksToBounds = true
- mainHost.addSubview(mainOverlay)
- mainOverlay.orientation = .vertical
- mainOverlay.spacing = 0
- mainOverlay.alignment = .centerX
- mainOverlay.distribution = .fill
- mainOverlay.translatesAutoresizingMaskIntoConstraints = false
- mainOverlay.setContentHuggingPriority(.defaultLow, for: .vertical)
- greetingLabel.font = .systemFont(ofSize: 32, weight: .bold)
- greetingLabel.textColor = Theme.primaryText
- greetingLabel.alignment = .center
- greetingLabel.maximumNumberOfLines = 1
- subtitleLabel.font = .systemFont(ofSize: 15, weight: .regular)
- subtitleLabel.textColor = Theme.secondaryText
- subtitleLabel.alignment = .center
- subtitleLabel.maximumNumberOfLines = 2
- let topInset = NSView()
- topInset.translatesAutoresizingMaskIntoConstraints = false
- topInset.heightAnchor.constraint(equalToConstant: 32).isActive = true
- configureSearchCard()
- let titleBlock = NSStackView(views: [greetingLabel, subtitleLabel])
- titleBlock.orientation = .vertical
- titleBlock.spacing = 10
- titleBlock.alignment = .centerX
- let midSpacer = NSView()
- midSpacer.translatesAutoresizingMaskIntoConstraints = false
- midSpacer.heightAnchor.constraint(equalToConstant: 20).isActive = true
- let overlayBottomSpacer = NSView()
- overlayBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
- overlayBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
- overlayBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
- mainOverlay.addArrangedSubview(topInset)
- mainOverlay.addArrangedSubview(titleBlock)
- mainOverlay.addArrangedSubview(midSpacer)
- mainOverlay.addArrangedSubview(searchCard)
- mainOverlay.addArrangedSubview(overlayBottomSpacer)
- contentStack.addArrangedSubview(sidebar)
- contentStack.addArrangedSubview(mainHost)
- NSLayoutConstraint.activate([
- scrollView.leadingAnchor.constraint(equalTo: leadingAnchor),
- scrollView.trailingAnchor.constraint(equalTo: trailingAnchor),
- scrollView.topAnchor.constraint(equalTo: topAnchor),
- scrollView.bottomAnchor.constraint(equalTo: bottomAnchor),
- chromeContainer.leadingAnchor.constraint(equalTo: documentContainer.leadingAnchor),
- chromeContainer.trailingAnchor.constraint(equalTo: documentContainer.trailingAnchor),
- chromeContainer.topAnchor.constraint(equalTo: documentContainer.topAnchor),
- chromeContainer.bottomAnchor.constraint(equalTo: documentContainer.bottomAnchor),
- contentStack.leadingAnchor.constraint(equalTo: chromeContainer.leadingAnchor),
- contentStack.trailingAnchor.constraint(equalTo: chromeContainer.trailingAnchor),
- contentStack.topAnchor.constraint(equalTo: chromeContainer.topAnchor),
- contentStack.bottomAnchor.constraint(equalTo: chromeContainer.bottomAnchor),
- sidebar.widthAnchor.constraint(equalToConstant: 225),
- mainHost.widthAnchor.constraint(greaterThanOrEqualToConstant: 720),
- mainOverlay.leadingAnchor.constraint(equalTo: mainHost.leadingAnchor),
- mainOverlay.trailingAnchor.constraint(equalTo: mainHost.trailingAnchor),
- mainOverlay.topAnchor.constraint(equalTo: mainHost.topAnchor),
- mainOverlay.bottomAnchor.constraint(equalTo: mainHost.bottomAnchor, constant: -24),
- searchCard.widthAnchor.constraint(equalTo: mainOverlay.widthAnchor, multiplier: 0.82),
- greetingLabel.leadingAnchor.constraint(equalTo: mainOverlay.leadingAnchor, constant: 24),
- greetingLabel.trailingAnchor.constraint(equalTo: mainOverlay.trailingAnchor, constant: -24),
- subtitleLabel.leadingAnchor.constraint(equalTo: greetingLabel.leadingAnchor),
- subtitleLabel.trailingAnchor.constraint(equalTo: greetingLabel.trailingAnchor)
- ])
- }
- private func configureSearchCard() {
- searchCard.wantsLayer = true
- searchCard.layer?.backgroundColor = Theme.cardBackground.cgColor
- searchCard.layer?.cornerRadius = 14
- searchCard.layer?.borderWidth = 1
- searchCard.layer?.borderColor = NSColor(calibratedWhite: 1, alpha: 0.06).cgColor
- searchCard.translatesAutoresizingMaskIntoConstraints = false
- searchCard.setContentHuggingPriority(.defaultHigh, for: .vertical)
- searchIcon.translatesAutoresizingMaskIntoConstraints = false
- searchIcon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 15, weight: .medium)
- searchIcon.image = NSImage(systemSymbolName: "magnifyingglass", accessibilityDescription: "Search")
- searchIcon.contentTintColor = Theme.secondaryText
- searchField.translatesAutoresizingMaskIntoConstraints = false
- searchField.isBordered = false
- searchField.drawsBackground = false
- searchField.focusRingType = .none
- searchField.font = .systemFont(ofSize: 14, weight: .regular)
- searchField.textColor = Theme.primaryText
- searchField.placeholderAttributedString = NSAttributedString(
- string: "Search jobs, companies, or locations",
- attributes: [
- .foregroundColor: Theme.tertiaryText,
- .font: NSFont.systemFont(ofSize: 14, weight: .regular)
- ]
- )
- searchField.cell?.usesSingleLineMode = true
- searchField.cell?.wraps = false
- searchField.cell?.isScrollable = true
- searchField.target = self
- searchField.action = #selector(didSubmitSearch)
- searchCard.addSubview(searchIcon)
- searchCard.addSubview(searchField)
- NSLayoutConstraint.activate([
- searchCard.heightAnchor.constraint(equalToConstant: 48),
- searchIcon.leadingAnchor.constraint(equalTo: searchCard.leadingAnchor, constant: 16),
- searchIcon.centerYAnchor.constraint(equalTo: searchCard.centerYAnchor),
- searchIcon.widthAnchor.constraint(equalToConstant: 18),
- searchIcon.heightAnchor.constraint(equalToConstant: 18),
- searchField.leadingAnchor.constraint(equalTo: searchIcon.trailingAnchor, constant: 10),
- searchField.trailingAnchor.constraint(equalTo: searchCard.trailingAnchor, constant: -16),
- searchField.centerYAnchor.constraint(equalTo: searchCard.centerYAnchor)
- ])
- }
- @objc private func didSubmitSearch() {
- // Hook up search submission here when wiring up real data.
- }
- private func configureSidebar() {
- let items = currentSidebarItems
- sidebar.arrangedSubviews.forEach {
- sidebar.removeArrangedSubview($0)
- $0.removeFromSuperview()
- }
- let brand = NSTextField(labelWithString: "Indeed AI\nJob Finder")
- brand.font = .systemFont(ofSize: 18, weight: .bold)
- brand.textColor = Theme.primaryText
- brand.alignment = .left
- sidebar.addArrangedSubview(brand)
- let titleToMenuSpacer = NSView()
- titleToMenuSpacer.translatesAutoresizingMaskIntoConstraints = false
- titleToMenuSpacer.heightAnchor.constraint(equalToConstant: 24).isActive = true
- sidebar.addArrangedSubview(titleToMenuSpacer)
- items.enumerated().forEach { index, item in
- let isSelected = index == selectedSidebarIndex
- let rowHost = SidebarNavRowView { [weak self] in
- self?.selectSidebarItem(at: index)
- }
- rowHost.translatesAutoresizingMaskIntoConstraints = false
- rowHost.wantsLayer = true
- rowHost.layer?.cornerRadius = 8
- if isSelected {
- rowHost.layer?.backgroundColor = Theme.selectionFill.cgColor
- }
- rowHost.setAccessibilityLabel(item.title)
- rowHost.setAccessibilityRole(.button)
- rowHost.setAccessibilitySelected(isSelected)
- let row = NSStackView()
- row.orientation = .horizontal
- row.spacing = 8
- row.alignment = .centerY
- row.translatesAutoresizingMaskIntoConstraints = false
- let icon = NSImageView()
- icon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .medium)
- icon.image = NSImage(systemSymbolName: item.systemImage, accessibilityDescription: item.title)
- icon.contentTintColor = isSelected ? Theme.primaryText : Theme.secondaryText
- let text = NSTextField(labelWithString: item.title)
- text.font = .systemFont(ofSize: 14, weight: .medium)
- text.textColor = isSelected ? Theme.primaryText : Theme.secondaryText
- text.refusesFirstResponder = true
- row.addArrangedSubview(icon)
- row.addArrangedSubview(text)
- if let badge = item.badge {
- let badgeField = NSTextField(labelWithString: badge)
- badgeField.font = .systemFont(ofSize: 11, weight: .semibold)
- badgeField.textColor = Theme.primaryText
- badgeField.wantsLayer = true
- badgeField.layer?.backgroundColor = Theme.toggleBackground.cgColor
- badgeField.layer?.cornerRadius = 8
- badgeField.alignment = .center
- badgeField.maximumNumberOfLines = 1
- badgeField.lineBreakMode = .byClipping
- badgeField.refusesFirstResponder = true
- badgeField.translatesAutoresizingMaskIntoConstraints = false
- badgeField.widthAnchor.constraint(equalToConstant: 42).isActive = true
- row.addArrangedSubview(NSView())
- row.addArrangedSubview(badgeField)
- }
- rowHost.addSubview(row)
- NSLayoutConstraint.activate([
- row.leadingAnchor.constraint(equalTo: rowHost.leadingAnchor, constant: 10),
- row.trailingAnchor.constraint(equalTo: rowHost.trailingAnchor, constant: -10),
- row.topAnchor.constraint(equalTo: rowHost.topAnchor, constant: 8),
- row.bottomAnchor.constraint(equalTo: rowHost.bottomAnchor, constant: -8)
- ])
- sidebar.addArrangedSubview(rowHost)
- }
- let sidebarBottomSpacer = NSView()
- sidebarBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
- sidebarBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
- sidebarBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
- sidebar.addArrangedSubview(sidebarBottomSpacer)
- let upgradeCard = NSView()
- upgradeCard.translatesAutoresizingMaskIntoConstraints = false
- upgradeCard.wantsLayer = true
- upgradeCard.layer?.backgroundColor = Theme.proCardFill.cgColor
- upgradeCard.layer?.cornerRadius = 14
- upgradeCard.layer?.borderWidth = 1
- upgradeCard.layer?.borderColor = Theme.proCardBorder.cgColor
- upgradeCard.layer?.masksToBounds = true
- let accentBar = NSView()
- accentBar.translatesAutoresizingMaskIntoConstraints = false
- accentBar.wantsLayer = true
- accentBar.layer?.backgroundColor = Theme.proAccent.cgColor
- let inner = NSStackView()
- inner.translatesAutoresizingMaskIntoConstraints = false
- inner.orientation = .vertical
- inner.spacing = 10
- inner.alignment = .leading
- let proIcon = NSImageView()
- proIcon.translatesAutoresizingMaskIntoConstraints = false
- proIcon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .semibold)
- proIcon.image = NSImage(systemSymbolName: "sparkles", accessibilityDescription: nil)
- proIcon.contentTintColor = Theme.proAccent
- let proEyebrow = NSTextField(labelWithString: "Premium")
- proEyebrow.font = .systemFont(ofSize: 11, weight: .heavy)
- proEyebrow.textColor = Theme.proAccent
- proEyebrow.alignment = .left
- let eyebrowRow = NSStackView(views: [proIcon, proEyebrow])
- eyebrowRow.orientation = .horizontal
- eyebrowRow.spacing = 6
- eyebrowRow.alignment = .centerY
- let headline = NSTextField(labelWithString: "Upgrade to Pro")
- headline.font = .systemFont(ofSize: 16, weight: .bold)
- headline.textColor = Theme.primaryText
- headline.alignment = .left
- let upgradeDescription = NSTextField(wrappingLabelWithString: "Unlimited AI matches, smart alerts, and interview prep—all in one place.")
- upgradeDescription.font = .systemFont(ofSize: 12, weight: .regular)
- upgradeDescription.textColor = Theme.secondaryText
- upgradeDescription.preferredMaxLayoutWidth = 165
- let upgradeButton = NSButton(title: "Upgrade to Pro", target: self, action: #selector(didTapUpgradeToPro))
- upgradeButton.isBordered = false
- upgradeButton.bezelStyle = .rounded
- upgradeButton.font = .systemFont(ofSize: 13, weight: .bold)
- upgradeButton.contentTintColor = Theme.proCTAText
- upgradeButton.wantsLayer = true
- upgradeButton.layer?.backgroundColor = Theme.proCTABackground.cgColor
- upgradeButton.layer?.cornerRadius = 20
- upgradeButton.translatesAutoresizingMaskIntoConstraints = false
- upgradeButton.heightAnchor.constraint(equalToConstant: 40).isActive = true
- inner.addArrangedSubview(eyebrowRow)
- inner.addArrangedSubview(headline)
- inner.addArrangedSubview(upgradeDescription)
- inner.addArrangedSubview(upgradeButton)
- upgradeCard.addSubview(accentBar)
- upgradeCard.addSubview(inner)
- let cardWidth: CGFloat = 197
- NSLayoutConstraint.activate([
- upgradeCard.widthAnchor.constraint(equalToConstant: cardWidth),
- accentBar.topAnchor.constraint(equalTo: upgradeCard.topAnchor),
- accentBar.leadingAnchor.constraint(equalTo: upgradeCard.leadingAnchor),
- accentBar.trailingAnchor.constraint(equalTo: upgradeCard.trailingAnchor),
- accentBar.heightAnchor.constraint(equalToConstant: 2),
- inner.leadingAnchor.constraint(equalTo: upgradeCard.leadingAnchor, constant: 14),
- inner.trailingAnchor.constraint(equalTo: upgradeCard.trailingAnchor, constant: -14),
- inner.topAnchor.constraint(equalTo: accentBar.bottomAnchor, constant: 12),
- inner.bottomAnchor.constraint(equalTo: upgradeCard.bottomAnchor, constant: -14),
- upgradeButton.widthAnchor.constraint(equalTo: inner.widthAnchor)
- ])
- sidebar.addArrangedSubview(upgradeCard)
- }
- @objc private func didTapUpgradeToPro() {
- guard let url = URL(string: "https://www.indeed.com") else { return }
- NSWorkspace.shared.open(url)
- }
- private func selectSidebarItem(at index: Int) {
- guard index >= 0, index < currentSidebarItems.count, index != selectedSidebarIndex else { return }
- selectedSidebarIndex = index
- configureSidebar()
- }
- private func updateDocumentLayout() {
- documentContainer.layoutSubtreeIfNeeded()
- let fittingHeight = max(chromeContainer.fittingSize.height, bounds.height)
- documentContainer.frame = NSRect(x: 0, y: 0, width: bounds.width, height: fittingHeight)
- }
- }
- /// Captures clicks for the full sidebar pill so icon, label, and padding behave as one tab.
- private final class SidebarNavRowView: NSView {
- private let onSelect: () -> Void
- init(onSelect: @escaping () -> Void) {
- self.onSelect = onSelect
- super.init(frame: .zero)
- }
- @available(*, unavailable)
- required init?(coder: NSCoder) {
- fatalError("init(coder:) has not been implemented")
- }
- override func hitTest(_ point: NSPoint) -> NSView? {
- guard let superview else { return super.hitTest(point) }
- let local = convert(point, from: superview)
- return bounds.contains(local) ? self : nil
- }
- override func mouseDown(with event: NSEvent) {
- onSelect()
- }
- override func updateTrackingAreas() {
- super.updateTrackingAreas()
- trackingAreas.forEach { removeTrackingArea($0) }
- addTrackingArea(NSTrackingArea(
- rect: bounds,
- options: [.activeInKeyWindow, .mouseEnteredAndExited, .inVisibleRect],
- owner: self,
- userInfo: nil
- ))
- }
- override func mouseEntered(with event: NSEvent) {
- super.mouseEntered(with: event)
- NSCursor.pointingHand.push()
- }
- override func mouseExited(with event: NSEvent) {
- super.mouseExited(with: event)
- NSCursor.pop()
- }
- }
|