Ei kuvausta

DashboardView.swift 18KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401
  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. override init(frame frameRect: NSRect) {
  37. super.init(frame: frameRect)
  38. setupLayout()
  39. }
  40. required init?(coder: NSCoder) {
  41. super.init(coder: coder)
  42. setupLayout()
  43. }
  44. override func layout() {
  45. super.layout()
  46. updateDocumentLayout()
  47. }
  48. func render(_ data: DashboardData) {
  49. greetingLabel.stringValue = "Welcome"
  50. subtitleLabel.stringValue = data.subtitle
  51. configureSidebar(data.sidebarItems)
  52. updateDocumentLayout()
  53. }
  54. private func setupLayout() {
  55. wantsLayer = true
  56. layer?.backgroundColor = Theme.pageBackground.cgColor
  57. scrollView.translatesAutoresizingMaskIntoConstraints = false
  58. scrollView.hasVerticalScroller = true
  59. scrollView.drawsBackground = false
  60. addSubview(scrollView)
  61. contentStack.orientation = .horizontal
  62. contentStack.spacing = 20
  63. contentStack.translatesAutoresizingMaskIntoConstraints = false
  64. contentStack.alignment = .height
  65. contentStack.edgeInsets = NSEdgeInsets(top: 24, left: 24, bottom: 24, right: 24)
  66. documentContainer.translatesAutoresizingMaskIntoConstraints = true
  67. documentContainer.autoresizingMask = [.width]
  68. documentContainer.frame = NSRect(x: 0, y: 0, width: 1040, height: 900)
  69. chromeContainer.translatesAutoresizingMaskIntoConstraints = false
  70. chromeContainer.wantsLayer = true
  71. chromeContainer.layer?.backgroundColor = Theme.chromeBackground.cgColor
  72. chromeContainer.layer?.cornerRadius = 0
  73. documentContainer.addSubview(chromeContainer)
  74. chromeContainer.addSubview(contentStack)
  75. scrollView.documentView = documentContainer
  76. sidebar.orientation = .vertical
  77. sidebar.spacing = 10
  78. sidebar.distribution = .fill
  79. sidebar.alignment = .leading
  80. sidebar.wantsLayer = true
  81. sidebar.layer?.backgroundColor = Theme.sidebarBackground.cgColor
  82. sidebar.layer?.cornerRadius = 16
  83. sidebar.edgeInsets = NSEdgeInsets(top: 18, left: 14, bottom: 18, right: 14)
  84. sidebar.translatesAutoresizingMaskIntoConstraints = false
  85. mainHost.translatesAutoresizingMaskIntoConstraints = false
  86. mainHost.wantsLayer = true
  87. mainHost.layer?.backgroundColor = Theme.mainHostBackground.cgColor
  88. mainHost.layer?.cornerRadius = 16
  89. mainHost.layer?.masksToBounds = true
  90. mainHost.addSubview(mainOverlay)
  91. mainOverlay.orientation = .vertical
  92. mainOverlay.spacing = 0
  93. mainOverlay.alignment = .centerX
  94. mainOverlay.distribution = .fill
  95. mainOverlay.translatesAutoresizingMaskIntoConstraints = false
  96. mainOverlay.setContentHuggingPriority(.defaultLow, for: .vertical)
  97. greetingLabel.font = .systemFont(ofSize: 32, weight: .bold)
  98. greetingLabel.textColor = Theme.primaryText
  99. greetingLabel.alignment = .center
  100. greetingLabel.maximumNumberOfLines = 1
  101. subtitleLabel.font = .systemFont(ofSize: 15, weight: .regular)
  102. subtitleLabel.textColor = Theme.secondaryText
  103. subtitleLabel.alignment = .center
  104. subtitleLabel.maximumNumberOfLines = 2
  105. let topInset = NSView()
  106. topInset.translatesAutoresizingMaskIntoConstraints = false
  107. topInset.heightAnchor.constraint(equalToConstant: 32).isActive = true
  108. configureSearchCard()
  109. let titleBlock = NSStackView(views: [greetingLabel, subtitleLabel])
  110. titleBlock.orientation = .vertical
  111. titleBlock.spacing = 10
  112. titleBlock.alignment = .centerX
  113. let midSpacer = NSView()
  114. midSpacer.translatesAutoresizingMaskIntoConstraints = false
  115. midSpacer.heightAnchor.constraint(equalToConstant: 20).isActive = true
  116. let overlayBottomSpacer = NSView()
  117. overlayBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
  118. overlayBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
  119. overlayBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
  120. mainOverlay.addArrangedSubview(topInset)
  121. mainOverlay.addArrangedSubview(titleBlock)
  122. mainOverlay.addArrangedSubview(midSpacer)
  123. mainOverlay.addArrangedSubview(searchCard)
  124. mainOverlay.addArrangedSubview(overlayBottomSpacer)
  125. contentStack.addArrangedSubview(sidebar)
  126. contentStack.addArrangedSubview(mainHost)
  127. NSLayoutConstraint.activate([
  128. scrollView.leadingAnchor.constraint(equalTo: leadingAnchor),
  129. scrollView.trailingAnchor.constraint(equalTo: trailingAnchor),
  130. scrollView.topAnchor.constraint(equalTo: topAnchor),
  131. scrollView.bottomAnchor.constraint(equalTo: bottomAnchor),
  132. chromeContainer.leadingAnchor.constraint(equalTo: documentContainer.leadingAnchor),
  133. chromeContainer.trailingAnchor.constraint(equalTo: documentContainer.trailingAnchor),
  134. chromeContainer.topAnchor.constraint(equalTo: documentContainer.topAnchor),
  135. chromeContainer.bottomAnchor.constraint(equalTo: documentContainer.bottomAnchor),
  136. contentStack.leadingAnchor.constraint(equalTo: chromeContainer.leadingAnchor),
  137. contentStack.trailingAnchor.constraint(equalTo: chromeContainer.trailingAnchor),
  138. contentStack.topAnchor.constraint(equalTo: chromeContainer.topAnchor),
  139. contentStack.bottomAnchor.constraint(equalTo: chromeContainer.bottomAnchor),
  140. sidebar.widthAnchor.constraint(equalToConstant: 225),
  141. mainHost.widthAnchor.constraint(greaterThanOrEqualToConstant: 720),
  142. mainOverlay.leadingAnchor.constraint(equalTo: mainHost.leadingAnchor),
  143. mainOverlay.trailingAnchor.constraint(equalTo: mainHost.trailingAnchor),
  144. mainOverlay.topAnchor.constraint(equalTo: mainHost.topAnchor),
  145. mainOverlay.bottomAnchor.constraint(equalTo: mainHost.bottomAnchor, constant: -24),
  146. searchCard.widthAnchor.constraint(equalTo: mainOverlay.widthAnchor, multiplier: 0.82),
  147. greetingLabel.leadingAnchor.constraint(equalTo: mainOverlay.leadingAnchor, constant: 24),
  148. greetingLabel.trailingAnchor.constraint(equalTo: mainOverlay.trailingAnchor, constant: -24),
  149. subtitleLabel.leadingAnchor.constraint(equalTo: greetingLabel.leadingAnchor),
  150. subtitleLabel.trailingAnchor.constraint(equalTo: greetingLabel.trailingAnchor)
  151. ])
  152. }
  153. private func configureSearchCard() {
  154. searchCard.wantsLayer = true
  155. searchCard.layer?.backgroundColor = Theme.cardBackground.cgColor
  156. searchCard.layer?.cornerRadius = 14
  157. searchCard.layer?.borderWidth = 1
  158. searchCard.layer?.borderColor = NSColor(calibratedWhite: 1, alpha: 0.06).cgColor
  159. searchCard.translatesAutoresizingMaskIntoConstraints = false
  160. searchCard.setContentHuggingPriority(.defaultHigh, for: .vertical)
  161. searchIcon.translatesAutoresizingMaskIntoConstraints = false
  162. searchIcon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 15, weight: .medium)
  163. searchIcon.image = NSImage(systemSymbolName: "magnifyingglass", accessibilityDescription: "Search")
  164. searchIcon.contentTintColor = Theme.secondaryText
  165. searchField.translatesAutoresizingMaskIntoConstraints = false
  166. searchField.isBordered = false
  167. searchField.drawsBackground = false
  168. searchField.focusRingType = .none
  169. searchField.font = .systemFont(ofSize: 14, weight: .regular)
  170. searchField.textColor = Theme.primaryText
  171. searchField.placeholderAttributedString = NSAttributedString(
  172. string: "Search jobs, companies, or locations",
  173. attributes: [
  174. .foregroundColor: Theme.tertiaryText,
  175. .font: NSFont.systemFont(ofSize: 14, weight: .regular)
  176. ]
  177. )
  178. searchField.cell?.usesSingleLineMode = true
  179. searchField.cell?.wraps = false
  180. searchField.cell?.isScrollable = true
  181. searchField.target = self
  182. searchField.action = #selector(didSubmitSearch)
  183. searchCard.addSubview(searchIcon)
  184. searchCard.addSubview(searchField)
  185. NSLayoutConstraint.activate([
  186. searchCard.heightAnchor.constraint(equalToConstant: 48),
  187. searchIcon.leadingAnchor.constraint(equalTo: searchCard.leadingAnchor, constant: 16),
  188. searchIcon.centerYAnchor.constraint(equalTo: searchCard.centerYAnchor),
  189. searchIcon.widthAnchor.constraint(equalToConstant: 18),
  190. searchIcon.heightAnchor.constraint(equalToConstant: 18),
  191. searchField.leadingAnchor.constraint(equalTo: searchIcon.trailingAnchor, constant: 10),
  192. searchField.trailingAnchor.constraint(equalTo: searchCard.trailingAnchor, constant: -16),
  193. searchField.centerYAnchor.constraint(equalTo: searchCard.centerYAnchor)
  194. ])
  195. }
  196. @objc private func didSubmitSearch() {
  197. // Hook up search submission here when wiring up real data.
  198. }
  199. private func configureSidebar(_ items: [SidebarItem]) {
  200. sidebar.arrangedSubviews.forEach {
  201. sidebar.removeArrangedSubview($0)
  202. $0.removeFromSuperview()
  203. }
  204. let brand = NSTextField(labelWithString: "Indeed AI\nJob Finder")
  205. brand.font = .systemFont(ofSize: 18, weight: .bold)
  206. brand.textColor = Theme.primaryText
  207. brand.alignment = .left
  208. sidebar.addArrangedSubview(brand)
  209. let titleToMenuSpacer = NSView()
  210. titleToMenuSpacer.translatesAutoresizingMaskIntoConstraints = false
  211. titleToMenuSpacer.heightAnchor.constraint(equalToConstant: 24).isActive = true
  212. sidebar.addArrangedSubview(titleToMenuSpacer)
  213. items.enumerated().forEach { index, item in
  214. let row = NSStackView()
  215. row.orientation = .horizontal
  216. row.spacing = 8
  217. row.alignment = .centerY
  218. row.wantsLayer = true
  219. row.layer?.cornerRadius = 8
  220. row.edgeInsets = NSEdgeInsets(top: 8, left: 10, bottom: 8, right: 10)
  221. let isSelected = index == 0
  222. if isSelected {
  223. row.layer?.backgroundColor = Theme.selectionFill.cgColor
  224. }
  225. let icon = NSImageView()
  226. icon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .medium)
  227. icon.image = NSImage(systemSymbolName: item.systemImage, accessibilityDescription: item.title)
  228. icon.contentTintColor = isSelected ? Theme.primaryText : Theme.secondaryText
  229. let text = NSTextField(labelWithString: item.title)
  230. text.font = .systemFont(ofSize: 14, weight: .medium)
  231. text.textColor = isSelected ? Theme.primaryText : Theme.secondaryText
  232. row.addArrangedSubview(icon)
  233. row.addArrangedSubview(text)
  234. if let badge = item.badge {
  235. let badgeField = NSTextField(labelWithString: badge)
  236. badgeField.font = .systemFont(ofSize: 11, weight: .semibold)
  237. badgeField.textColor = Theme.primaryText
  238. badgeField.wantsLayer = true
  239. badgeField.layer?.backgroundColor = Theme.toggleBackground.cgColor
  240. badgeField.layer?.cornerRadius = 8
  241. badgeField.alignment = .center
  242. badgeField.maximumNumberOfLines = 1
  243. badgeField.lineBreakMode = .byClipping
  244. badgeField.translatesAutoresizingMaskIntoConstraints = false
  245. badgeField.widthAnchor.constraint(equalToConstant: 42).isActive = true
  246. row.addArrangedSubview(NSView())
  247. row.addArrangedSubview(badgeField)
  248. }
  249. sidebar.addArrangedSubview(row)
  250. }
  251. let sidebarBottomSpacer = NSView()
  252. sidebarBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
  253. sidebarBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
  254. sidebarBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
  255. sidebar.addArrangedSubview(sidebarBottomSpacer)
  256. let upgradeCard = NSView()
  257. upgradeCard.translatesAutoresizingMaskIntoConstraints = false
  258. upgradeCard.wantsLayer = true
  259. upgradeCard.layer?.backgroundColor = Theme.proCardFill.cgColor
  260. upgradeCard.layer?.cornerRadius = 14
  261. upgradeCard.layer?.borderWidth = 1
  262. upgradeCard.layer?.borderColor = Theme.proCardBorder.cgColor
  263. upgradeCard.layer?.masksToBounds = true
  264. let accentBar = NSView()
  265. accentBar.translatesAutoresizingMaskIntoConstraints = false
  266. accentBar.wantsLayer = true
  267. accentBar.layer?.backgroundColor = Theme.proAccent.cgColor
  268. let inner = NSStackView()
  269. inner.translatesAutoresizingMaskIntoConstraints = false
  270. inner.orientation = .vertical
  271. inner.spacing = 10
  272. inner.alignment = .leading
  273. let proIcon = NSImageView()
  274. proIcon.translatesAutoresizingMaskIntoConstraints = false
  275. proIcon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .semibold)
  276. proIcon.image = NSImage(systemSymbolName: "sparkles", accessibilityDescription: nil)
  277. proIcon.contentTintColor = Theme.proAccent
  278. let proEyebrow = NSTextField(labelWithString: "Premium")
  279. proEyebrow.font = .systemFont(ofSize: 11, weight: .heavy)
  280. proEyebrow.textColor = Theme.proAccent
  281. proEyebrow.alignment = .left
  282. let eyebrowRow = NSStackView(views: [proIcon, proEyebrow])
  283. eyebrowRow.orientation = .horizontal
  284. eyebrowRow.spacing = 6
  285. eyebrowRow.alignment = .centerY
  286. let headline = NSTextField(labelWithString: "Upgrade to Pro")
  287. headline.font = .systemFont(ofSize: 16, weight: .bold)
  288. headline.textColor = Theme.primaryText
  289. headline.alignment = .left
  290. let upgradeDescription = NSTextField(wrappingLabelWithString: "Unlimited AI matches, smart alerts, and interview prep—all in one place.")
  291. upgradeDescription.font = .systemFont(ofSize: 12, weight: .regular)
  292. upgradeDescription.textColor = Theme.secondaryText
  293. upgradeDescription.preferredMaxLayoutWidth = 165
  294. let upgradeButton = NSButton(title: "Upgrade to Pro", target: self, action: #selector(didTapUpgradeToPro))
  295. upgradeButton.isBordered = false
  296. upgradeButton.bezelStyle = .rounded
  297. upgradeButton.font = .systemFont(ofSize: 13, weight: .bold)
  298. upgradeButton.contentTintColor = Theme.proCTAText
  299. upgradeButton.wantsLayer = true
  300. upgradeButton.layer?.backgroundColor = Theme.proCTABackground.cgColor
  301. upgradeButton.layer?.cornerRadius = 20
  302. upgradeButton.translatesAutoresizingMaskIntoConstraints = false
  303. upgradeButton.heightAnchor.constraint(equalToConstant: 40).isActive = true
  304. inner.addArrangedSubview(eyebrowRow)
  305. inner.addArrangedSubview(headline)
  306. inner.addArrangedSubview(upgradeDescription)
  307. inner.addArrangedSubview(upgradeButton)
  308. upgradeCard.addSubview(accentBar)
  309. upgradeCard.addSubview(inner)
  310. let cardWidth: CGFloat = 197
  311. NSLayoutConstraint.activate([
  312. upgradeCard.widthAnchor.constraint(equalToConstant: cardWidth),
  313. accentBar.topAnchor.constraint(equalTo: upgradeCard.topAnchor),
  314. accentBar.leadingAnchor.constraint(equalTo: upgradeCard.leadingAnchor),
  315. accentBar.trailingAnchor.constraint(equalTo: upgradeCard.trailingAnchor),
  316. accentBar.heightAnchor.constraint(equalToConstant: 2),
  317. inner.leadingAnchor.constraint(equalTo: upgradeCard.leadingAnchor, constant: 14),
  318. inner.trailingAnchor.constraint(equalTo: upgradeCard.trailingAnchor, constant: -14),
  319. inner.topAnchor.constraint(equalTo: accentBar.bottomAnchor, constant: 12),
  320. inner.bottomAnchor.constraint(equalTo: upgradeCard.bottomAnchor, constant: -14),
  321. upgradeButton.widthAnchor.constraint(equalTo: inner.widthAnchor)
  322. ])
  323. sidebar.addArrangedSubview(upgradeCard)
  324. }
  325. @objc private func didTapUpgradeToPro() {
  326. guard let url = URL(string: "https://www.indeed.com") else { return }
  327. NSWorkspace.shared.open(url)
  328. }
  329. private func updateDocumentLayout() {
  330. documentContainer.layoutSubtreeIfNeeded()
  331. let fittingHeight = max(chromeContainer.fittingSize.height, bounds.height)
  332. documentContainer.frame = NSRect(x: 0, y: 0, width: bounds.width, height: fittingHeight)
  333. }
  334. }