説明なし

DashboardView.swift 21KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480
  1. //
  2. // DashboardView.swift
  3. // App for Indeed
  4. //
  5. import Cocoa
  6. final class DashboardView: NSView {
  7. private enum Theme {
  8. static let pageBackground = NSColor(calibratedWhite: 0.02, alpha: 1)
  9. static let chromeBackground = NSColor(calibratedWhite: 0.04, alpha: 1)
  10. static let sidebarBackground = NSColor(calibratedWhite: 0.07, alpha: 1)
  11. static let mainHostBackground = NSColor(calibratedWhite: 0.06, alpha: 1)
  12. static let selectionFill = NSColor(calibratedWhite: 1, alpha: 0.1)
  13. static let cardBackground = NSColor(calibratedWhite: 0.11, alpha: 1)
  14. static let toggleBackground = NSColor(calibratedWhite: 0.16, alpha: 1)
  15. static let primaryText = NSColor(calibratedWhite: 0.96, alpha: 1)
  16. static let secondaryText = NSColor(calibratedWhite: 0.62, alpha: 1)
  17. static let tertiaryText = NSColor(calibratedWhite: 0.48, alpha: 1)
  18. static let proCardFill = NSColor(calibratedRed: 0.1, green: 0.09, blue: 0.12, alpha: 1)
  19. static let proCardBorder = NSColor(calibratedWhite: 1, alpha: 0.09)
  20. static let proAccent = NSColor(calibratedRed: 0.98, green: 0.82, blue: 0.38, alpha: 1)
  21. static let proCTABackground = NSColor(calibratedWhite: 0.97, alpha: 1)
  22. static let proCTAText = NSColor(calibratedWhite: 0.05, alpha: 1)
  23. }
  24. private let contentStack = NSStackView()
  25. private let documentContainer = NSView()
  26. private let chromeContainer = NSView()
  27. private let sidebar = NSStackView()
  28. private let mainHost = NSView()
  29. private let mainOverlay = NSStackView()
  30. private let greetingLabel = NSTextField(labelWithString: "")
  31. private let subtitleLabel = NSTextField(labelWithString: "")
  32. private let searchCard = NSView()
  33. private let searchIcon = NSImageView()
  34. private let searchField = NSTextField()
  35. private let scrollView = NSScrollView()
  36. private var currentSidebarItems: [SidebarItem] = []
  37. private var selectedSidebarIndex: Int = 0
  38. override init(frame frameRect: NSRect) {
  39. super.init(frame: frameRect)
  40. setupLayout()
  41. }
  42. required init?(coder: NSCoder) {
  43. super.init(coder: coder)
  44. setupLayout()
  45. }
  46. override func layout() {
  47. super.layout()
  48. updateDocumentLayout()
  49. }
  50. func render(_ data: DashboardData) {
  51. greetingLabel.stringValue = "Welcome"
  52. subtitleLabel.stringValue = data.subtitle
  53. currentSidebarItems = data.sidebarItems
  54. if selectedSidebarIndex >= currentSidebarItems.count {
  55. selectedSidebarIndex = max(0, currentSidebarItems.count - 1)
  56. }
  57. configureSidebar()
  58. updateDocumentLayout()
  59. }
  60. private func setupLayout() {
  61. wantsLayer = true
  62. layer?.backgroundColor = Theme.pageBackground.cgColor
  63. scrollView.translatesAutoresizingMaskIntoConstraints = false
  64. scrollView.hasVerticalScroller = true
  65. scrollView.drawsBackground = false
  66. addSubview(scrollView)
  67. contentStack.orientation = .horizontal
  68. contentStack.spacing = 20
  69. contentStack.translatesAutoresizingMaskIntoConstraints = false
  70. contentStack.alignment = .height
  71. contentStack.edgeInsets = NSEdgeInsets(top: 24, left: 24, bottom: 24, right: 24)
  72. documentContainer.translatesAutoresizingMaskIntoConstraints = true
  73. documentContainer.autoresizingMask = [.width]
  74. documentContainer.frame = NSRect(x: 0, y: 0, width: 1040, height: 900)
  75. chromeContainer.translatesAutoresizingMaskIntoConstraints = false
  76. chromeContainer.wantsLayer = true
  77. chromeContainer.layer?.backgroundColor = Theme.chromeBackground.cgColor
  78. chromeContainer.layer?.cornerRadius = 0
  79. documentContainer.addSubview(chromeContainer)
  80. chromeContainer.addSubview(contentStack)
  81. scrollView.documentView = documentContainer
  82. sidebar.orientation = .vertical
  83. sidebar.spacing = 10
  84. sidebar.distribution = .fill
  85. sidebar.alignment = .leading
  86. sidebar.wantsLayer = true
  87. sidebar.layer?.backgroundColor = Theme.sidebarBackground.cgColor
  88. sidebar.layer?.cornerRadius = 16
  89. sidebar.edgeInsets = NSEdgeInsets(top: 18, left: 14, bottom: 18, right: 14)
  90. sidebar.translatesAutoresizingMaskIntoConstraints = false
  91. mainHost.translatesAutoresizingMaskIntoConstraints = false
  92. mainHost.wantsLayer = true
  93. mainHost.layer?.backgroundColor = Theme.mainHostBackground.cgColor
  94. mainHost.layer?.cornerRadius = 16
  95. mainHost.layer?.masksToBounds = true
  96. mainHost.addSubview(mainOverlay)
  97. mainOverlay.orientation = .vertical
  98. mainOverlay.spacing = 0
  99. mainOverlay.alignment = .centerX
  100. mainOverlay.distribution = .fill
  101. mainOverlay.translatesAutoresizingMaskIntoConstraints = false
  102. mainOverlay.setContentHuggingPriority(.defaultLow, for: .vertical)
  103. greetingLabel.font = .systemFont(ofSize: 32, weight: .bold)
  104. greetingLabel.textColor = Theme.primaryText
  105. greetingLabel.alignment = .center
  106. greetingLabel.maximumNumberOfLines = 1
  107. subtitleLabel.font = .systemFont(ofSize: 15, weight: .regular)
  108. subtitleLabel.textColor = Theme.secondaryText
  109. subtitleLabel.alignment = .center
  110. subtitleLabel.maximumNumberOfLines = 2
  111. let topInset = NSView()
  112. topInset.translatesAutoresizingMaskIntoConstraints = false
  113. topInset.heightAnchor.constraint(equalToConstant: 32).isActive = true
  114. configureSearchCard()
  115. let titleBlock = NSStackView(views: [greetingLabel, subtitleLabel])
  116. titleBlock.orientation = .vertical
  117. titleBlock.spacing = 10
  118. titleBlock.alignment = .centerX
  119. let midSpacer = NSView()
  120. midSpacer.translatesAutoresizingMaskIntoConstraints = false
  121. midSpacer.heightAnchor.constraint(equalToConstant: 20).isActive = true
  122. let overlayBottomSpacer = NSView()
  123. overlayBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
  124. overlayBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
  125. overlayBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
  126. mainOverlay.addArrangedSubview(topInset)
  127. mainOverlay.addArrangedSubview(titleBlock)
  128. mainOverlay.addArrangedSubview(midSpacer)
  129. mainOverlay.addArrangedSubview(searchCard)
  130. mainOverlay.addArrangedSubview(overlayBottomSpacer)
  131. contentStack.addArrangedSubview(sidebar)
  132. contentStack.addArrangedSubview(mainHost)
  133. NSLayoutConstraint.activate([
  134. scrollView.leadingAnchor.constraint(equalTo: leadingAnchor),
  135. scrollView.trailingAnchor.constraint(equalTo: trailingAnchor),
  136. scrollView.topAnchor.constraint(equalTo: topAnchor),
  137. scrollView.bottomAnchor.constraint(equalTo: bottomAnchor),
  138. chromeContainer.leadingAnchor.constraint(equalTo: documentContainer.leadingAnchor),
  139. chromeContainer.trailingAnchor.constraint(equalTo: documentContainer.trailingAnchor),
  140. chromeContainer.topAnchor.constraint(equalTo: documentContainer.topAnchor),
  141. chromeContainer.bottomAnchor.constraint(equalTo: documentContainer.bottomAnchor),
  142. contentStack.leadingAnchor.constraint(equalTo: chromeContainer.leadingAnchor),
  143. contentStack.trailingAnchor.constraint(equalTo: chromeContainer.trailingAnchor),
  144. contentStack.topAnchor.constraint(equalTo: chromeContainer.topAnchor),
  145. contentStack.bottomAnchor.constraint(equalTo: chromeContainer.bottomAnchor),
  146. sidebar.widthAnchor.constraint(equalToConstant: 225),
  147. mainHost.widthAnchor.constraint(greaterThanOrEqualToConstant: 720),
  148. mainOverlay.leadingAnchor.constraint(equalTo: mainHost.leadingAnchor),
  149. mainOverlay.trailingAnchor.constraint(equalTo: mainHost.trailingAnchor),
  150. mainOverlay.topAnchor.constraint(equalTo: mainHost.topAnchor),
  151. mainOverlay.bottomAnchor.constraint(equalTo: mainHost.bottomAnchor, constant: -24),
  152. searchCard.widthAnchor.constraint(equalTo: mainOverlay.widthAnchor, multiplier: 0.82),
  153. greetingLabel.leadingAnchor.constraint(equalTo: mainOverlay.leadingAnchor, constant: 24),
  154. greetingLabel.trailingAnchor.constraint(equalTo: mainOverlay.trailingAnchor, constant: -24),
  155. subtitleLabel.leadingAnchor.constraint(equalTo: greetingLabel.leadingAnchor),
  156. subtitleLabel.trailingAnchor.constraint(equalTo: greetingLabel.trailingAnchor)
  157. ])
  158. }
  159. private func configureSearchCard() {
  160. searchCard.wantsLayer = true
  161. searchCard.layer?.backgroundColor = Theme.cardBackground.cgColor
  162. searchCard.layer?.cornerRadius = 14
  163. searchCard.layer?.borderWidth = 1
  164. searchCard.layer?.borderColor = NSColor(calibratedWhite: 1, alpha: 0.06).cgColor
  165. searchCard.translatesAutoresizingMaskIntoConstraints = false
  166. searchCard.setContentHuggingPriority(.defaultHigh, for: .vertical)
  167. searchIcon.translatesAutoresizingMaskIntoConstraints = false
  168. searchIcon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 15, weight: .medium)
  169. searchIcon.image = NSImage(systemSymbolName: "magnifyingglass", accessibilityDescription: "Search")
  170. searchIcon.contentTintColor = Theme.secondaryText
  171. searchField.translatesAutoresizingMaskIntoConstraints = false
  172. searchField.isBordered = false
  173. searchField.drawsBackground = false
  174. searchField.focusRingType = .none
  175. searchField.font = .systemFont(ofSize: 14, weight: .regular)
  176. searchField.textColor = Theme.primaryText
  177. searchField.placeholderAttributedString = NSAttributedString(
  178. string: "Search jobs, companies, or locations",
  179. attributes: [
  180. .foregroundColor: Theme.tertiaryText,
  181. .font: NSFont.systemFont(ofSize: 14, weight: .regular)
  182. ]
  183. )
  184. searchField.cell?.usesSingleLineMode = true
  185. searchField.cell?.wraps = false
  186. searchField.cell?.isScrollable = true
  187. searchField.target = self
  188. searchField.action = #selector(didSubmitSearch)
  189. searchCard.addSubview(searchIcon)
  190. searchCard.addSubview(searchField)
  191. NSLayoutConstraint.activate([
  192. searchCard.heightAnchor.constraint(equalToConstant: 48),
  193. searchIcon.leadingAnchor.constraint(equalTo: searchCard.leadingAnchor, constant: 16),
  194. searchIcon.centerYAnchor.constraint(equalTo: searchCard.centerYAnchor),
  195. searchIcon.widthAnchor.constraint(equalToConstant: 18),
  196. searchIcon.heightAnchor.constraint(equalToConstant: 18),
  197. searchField.leadingAnchor.constraint(equalTo: searchIcon.trailingAnchor, constant: 10),
  198. searchField.trailingAnchor.constraint(equalTo: searchCard.trailingAnchor, constant: -16),
  199. searchField.centerYAnchor.constraint(equalTo: searchCard.centerYAnchor)
  200. ])
  201. }
  202. @objc private func didSubmitSearch() {
  203. // Hook up search submission here when wiring up real data.
  204. }
  205. private func configureSidebar() {
  206. let items = currentSidebarItems
  207. sidebar.arrangedSubviews.forEach {
  208. sidebar.removeArrangedSubview($0)
  209. $0.removeFromSuperview()
  210. }
  211. let brand = NSTextField(labelWithString: "Indeed AI\nJob Finder")
  212. brand.font = .systemFont(ofSize: 18, weight: .bold)
  213. brand.textColor = Theme.primaryText
  214. brand.alignment = .left
  215. sidebar.addArrangedSubview(brand)
  216. let titleToMenuSpacer = NSView()
  217. titleToMenuSpacer.translatesAutoresizingMaskIntoConstraints = false
  218. titleToMenuSpacer.heightAnchor.constraint(equalToConstant: 24).isActive = true
  219. sidebar.addArrangedSubview(titleToMenuSpacer)
  220. items.enumerated().forEach { index, item in
  221. let isSelected = index == selectedSidebarIndex
  222. let rowHost = SidebarNavRowView { [weak self] in
  223. self?.selectSidebarItem(at: index)
  224. }
  225. rowHost.translatesAutoresizingMaskIntoConstraints = false
  226. rowHost.wantsLayer = true
  227. rowHost.layer?.cornerRadius = 8
  228. if isSelected {
  229. rowHost.layer?.backgroundColor = Theme.selectionFill.cgColor
  230. }
  231. rowHost.setAccessibilityLabel(item.title)
  232. rowHost.setAccessibilityRole(.button)
  233. rowHost.setAccessibilitySelected(isSelected)
  234. let row = NSStackView()
  235. row.orientation = .horizontal
  236. row.spacing = 8
  237. row.alignment = .centerY
  238. row.translatesAutoresizingMaskIntoConstraints = false
  239. let icon = NSImageView()
  240. icon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .medium)
  241. icon.image = NSImage(systemSymbolName: item.systemImage, accessibilityDescription: item.title)
  242. icon.contentTintColor = isSelected ? Theme.primaryText : Theme.secondaryText
  243. let text = NSTextField(labelWithString: item.title)
  244. text.font = .systemFont(ofSize: 14, weight: .medium)
  245. text.textColor = isSelected ? Theme.primaryText : Theme.secondaryText
  246. text.refusesFirstResponder = true
  247. row.addArrangedSubview(icon)
  248. row.addArrangedSubview(text)
  249. if let badge = item.badge {
  250. let badgeField = NSTextField(labelWithString: badge)
  251. badgeField.font = .systemFont(ofSize: 11, weight: .semibold)
  252. badgeField.textColor = Theme.primaryText
  253. badgeField.wantsLayer = true
  254. badgeField.layer?.backgroundColor = Theme.toggleBackground.cgColor
  255. badgeField.layer?.cornerRadius = 8
  256. badgeField.alignment = .center
  257. badgeField.maximumNumberOfLines = 1
  258. badgeField.lineBreakMode = .byClipping
  259. badgeField.refusesFirstResponder = true
  260. badgeField.translatesAutoresizingMaskIntoConstraints = false
  261. badgeField.widthAnchor.constraint(equalToConstant: 42).isActive = true
  262. row.addArrangedSubview(NSView())
  263. row.addArrangedSubview(badgeField)
  264. }
  265. rowHost.addSubview(row)
  266. NSLayoutConstraint.activate([
  267. row.leadingAnchor.constraint(equalTo: rowHost.leadingAnchor, constant: 10),
  268. row.trailingAnchor.constraint(equalTo: rowHost.trailingAnchor, constant: -10),
  269. row.topAnchor.constraint(equalTo: rowHost.topAnchor, constant: 8),
  270. row.bottomAnchor.constraint(equalTo: rowHost.bottomAnchor, constant: -8)
  271. ])
  272. sidebar.addArrangedSubview(rowHost)
  273. }
  274. let sidebarBottomSpacer = NSView()
  275. sidebarBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
  276. sidebarBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
  277. sidebarBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
  278. sidebar.addArrangedSubview(sidebarBottomSpacer)
  279. let upgradeCard = NSView()
  280. upgradeCard.translatesAutoresizingMaskIntoConstraints = false
  281. upgradeCard.wantsLayer = true
  282. upgradeCard.layer?.backgroundColor = Theme.proCardFill.cgColor
  283. upgradeCard.layer?.cornerRadius = 14
  284. upgradeCard.layer?.borderWidth = 1
  285. upgradeCard.layer?.borderColor = Theme.proCardBorder.cgColor
  286. upgradeCard.layer?.masksToBounds = true
  287. let accentBar = NSView()
  288. accentBar.translatesAutoresizingMaskIntoConstraints = false
  289. accentBar.wantsLayer = true
  290. accentBar.layer?.backgroundColor = Theme.proAccent.cgColor
  291. let inner = NSStackView()
  292. inner.translatesAutoresizingMaskIntoConstraints = false
  293. inner.orientation = .vertical
  294. inner.spacing = 10
  295. inner.alignment = .leading
  296. let proIcon = NSImageView()
  297. proIcon.translatesAutoresizingMaskIntoConstraints = false
  298. proIcon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .semibold)
  299. proIcon.image = NSImage(systemSymbolName: "sparkles", accessibilityDescription: nil)
  300. proIcon.contentTintColor = Theme.proAccent
  301. let proEyebrow = NSTextField(labelWithString: "Premium")
  302. proEyebrow.font = .systemFont(ofSize: 11, weight: .heavy)
  303. proEyebrow.textColor = Theme.proAccent
  304. proEyebrow.alignment = .left
  305. let eyebrowRow = NSStackView(views: [proIcon, proEyebrow])
  306. eyebrowRow.orientation = .horizontal
  307. eyebrowRow.spacing = 6
  308. eyebrowRow.alignment = .centerY
  309. let headline = NSTextField(labelWithString: "Upgrade to Pro")
  310. headline.font = .systemFont(ofSize: 16, weight: .bold)
  311. headline.textColor = Theme.primaryText
  312. headline.alignment = .left
  313. let upgradeDescription = NSTextField(wrappingLabelWithString: "Unlimited AI matches, smart alerts, and interview prep—all in one place.")
  314. upgradeDescription.font = .systemFont(ofSize: 12, weight: .regular)
  315. upgradeDescription.textColor = Theme.secondaryText
  316. upgradeDescription.preferredMaxLayoutWidth = 165
  317. let upgradeButton = NSButton(title: "Upgrade to Pro", target: self, action: #selector(didTapUpgradeToPro))
  318. upgradeButton.isBordered = false
  319. upgradeButton.bezelStyle = .rounded
  320. upgradeButton.font = .systemFont(ofSize: 13, weight: .bold)
  321. upgradeButton.contentTintColor = Theme.proCTAText
  322. upgradeButton.wantsLayer = true
  323. upgradeButton.layer?.backgroundColor = Theme.proCTABackground.cgColor
  324. upgradeButton.layer?.cornerRadius = 20
  325. upgradeButton.translatesAutoresizingMaskIntoConstraints = false
  326. upgradeButton.heightAnchor.constraint(equalToConstant: 40).isActive = true
  327. inner.addArrangedSubview(eyebrowRow)
  328. inner.addArrangedSubview(headline)
  329. inner.addArrangedSubview(upgradeDescription)
  330. inner.addArrangedSubview(upgradeButton)
  331. upgradeCard.addSubview(accentBar)
  332. upgradeCard.addSubview(inner)
  333. let cardWidth: CGFloat = 197
  334. NSLayoutConstraint.activate([
  335. upgradeCard.widthAnchor.constraint(equalToConstant: cardWidth),
  336. accentBar.topAnchor.constraint(equalTo: upgradeCard.topAnchor),
  337. accentBar.leadingAnchor.constraint(equalTo: upgradeCard.leadingAnchor),
  338. accentBar.trailingAnchor.constraint(equalTo: upgradeCard.trailingAnchor),
  339. accentBar.heightAnchor.constraint(equalToConstant: 2),
  340. inner.leadingAnchor.constraint(equalTo: upgradeCard.leadingAnchor, constant: 14),
  341. inner.trailingAnchor.constraint(equalTo: upgradeCard.trailingAnchor, constant: -14),
  342. inner.topAnchor.constraint(equalTo: accentBar.bottomAnchor, constant: 12),
  343. inner.bottomAnchor.constraint(equalTo: upgradeCard.bottomAnchor, constant: -14),
  344. upgradeButton.widthAnchor.constraint(equalTo: inner.widthAnchor)
  345. ])
  346. sidebar.addArrangedSubview(upgradeCard)
  347. }
  348. @objc private func didTapUpgradeToPro() {
  349. guard let url = URL(string: "https://www.indeed.com") else { return }
  350. NSWorkspace.shared.open(url)
  351. }
  352. private func selectSidebarItem(at index: Int) {
  353. guard index >= 0, index < currentSidebarItems.count, index != selectedSidebarIndex else { return }
  354. selectedSidebarIndex = index
  355. configureSidebar()
  356. }
  357. private func updateDocumentLayout() {
  358. documentContainer.layoutSubtreeIfNeeded()
  359. let fittingHeight = max(chromeContainer.fittingSize.height, bounds.height)
  360. documentContainer.frame = NSRect(x: 0, y: 0, width: bounds.width, height: fittingHeight)
  361. }
  362. }
  363. /// Captures clicks for the full sidebar pill so icon, label, and padding behave as one tab.
  364. private final class SidebarNavRowView: NSView {
  365. private let onSelect: () -> Void
  366. init(onSelect: @escaping () -> Void) {
  367. self.onSelect = onSelect
  368. super.init(frame: .zero)
  369. }
  370. @available(*, unavailable)
  371. required init?(coder: NSCoder) {
  372. fatalError("init(coder:) has not been implemented")
  373. }
  374. override func hitTest(_ point: NSPoint) -> NSView? {
  375. guard let superview else { return super.hitTest(point) }
  376. let local = convert(point, from: superview)
  377. return bounds.contains(local) ? self : nil
  378. }
  379. override func mouseDown(with event: NSEvent) {
  380. onSelect()
  381. }
  382. override func updateTrackingAreas() {
  383. super.updateTrackingAreas()
  384. trackingAreas.forEach { removeTrackingArea($0) }
  385. addTrackingArea(NSTrackingArea(
  386. rect: bounds,
  387. options: [.activeInKeyWindow, .mouseEnteredAndExited, .inVisibleRect],
  388. owner: self,
  389. userInfo: nil
  390. ))
  391. }
  392. override func mouseEntered(with event: NSEvent) {
  393. super.mouseEntered(with: event)
  394. NSCursor.pointingHand.push()
  395. }
  396. override func mouseExited(with event: NSEvent) {
  397. super.mouseExited(with: event)
  398. NSCursor.pop()
  399. }
  400. }