説明なし

DashboardView.swift 15KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
  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. }
  19. private let contentStack = NSStackView()
  20. private let documentContainer = NSView()
  21. private let chromeContainer = NSView()
  22. private let sidebar = NSStackView()
  23. private let mainHost = NSView()
  24. private let mainOverlay = NSStackView()
  25. private let greetingLabel = NSTextField(labelWithString: "")
  26. private let subtitleLabel = NSTextField(labelWithString: "")
  27. private let insightsCard = NSView()
  28. private let insightsTitleLabel = NSTextField(labelWithString: "")
  29. private let insightsBodyLabel = NSTextField(labelWithString: "")
  30. private let togglesLabel = NSTextField(labelWithString: "Show:")
  31. private let savedToggleButton = NSButton(title: "Saved", target: nil, action: nil)
  32. private let interviewsToggleButton = NSButton(title: "Interviews", target: nil, action: nil)
  33. private let sparkleView = NSImageView()
  34. private let scrollView = NSScrollView()
  35. override init(frame frameRect: NSRect) {
  36. super.init(frame: frameRect)
  37. setupLayout()
  38. }
  39. required init?(coder: NSCoder) {
  40. super.init(coder: coder)
  41. setupLayout()
  42. }
  43. override func layout() {
  44. super.layout()
  45. updateDocumentLayout()
  46. }
  47. func render(_ data: DashboardData) {
  48. greetingLabel.stringValue = "Welcome back, \(data.greetingName)! 👋"
  49. subtitleLabel.stringValue = data.subtitle
  50. insightsTitleLabel.stringValue = data.profileInsightsTitle
  51. insightsBodyLabel.stringValue = data.profileInsightsBody
  52. configureSidebar(data.sidebarItems)
  53. updateDocumentLayout()
  54. }
  55. private func setupLayout() {
  56. wantsLayer = true
  57. layer?.backgroundColor = Theme.pageBackground.cgColor
  58. scrollView.translatesAutoresizingMaskIntoConstraints = false
  59. scrollView.hasVerticalScroller = true
  60. scrollView.drawsBackground = false
  61. addSubview(scrollView)
  62. contentStack.orientation = .horizontal
  63. contentStack.spacing = 20
  64. contentStack.translatesAutoresizingMaskIntoConstraints = false
  65. contentStack.alignment = .height
  66. contentStack.edgeInsets = NSEdgeInsets(top: 24, left: 24, bottom: 24, right: 24)
  67. documentContainer.translatesAutoresizingMaskIntoConstraints = true
  68. documentContainer.autoresizingMask = [.width]
  69. documentContainer.frame = NSRect(x: 0, y: 0, width: 1040, height: 900)
  70. chromeContainer.translatesAutoresizingMaskIntoConstraints = false
  71. chromeContainer.wantsLayer = true
  72. chromeContainer.layer?.backgroundColor = Theme.chromeBackground.cgColor
  73. chromeContainer.layer?.cornerRadius = 0
  74. documentContainer.addSubview(chromeContainer)
  75. chromeContainer.addSubview(contentStack)
  76. scrollView.documentView = documentContainer
  77. sidebar.orientation = .vertical
  78. sidebar.spacing = 10
  79. sidebar.distribution = .fill
  80. sidebar.alignment = .leading
  81. sidebar.wantsLayer = true
  82. sidebar.layer?.backgroundColor = Theme.sidebarBackground.cgColor
  83. sidebar.layer?.cornerRadius = 16
  84. sidebar.edgeInsets = NSEdgeInsets(top: 18, left: 14, bottom: 18, right: 14)
  85. sidebar.translatesAutoresizingMaskIntoConstraints = false
  86. mainHost.translatesAutoresizingMaskIntoConstraints = false
  87. mainHost.wantsLayer = true
  88. mainHost.layer?.backgroundColor = Theme.mainHostBackground.cgColor
  89. mainHost.layer?.cornerRadius = 16
  90. mainHost.layer?.masksToBounds = true
  91. mainHost.addSubview(mainOverlay)
  92. mainOverlay.orientation = .vertical
  93. mainOverlay.spacing = 0
  94. mainOverlay.alignment = .centerX
  95. mainOverlay.distribution = .fill
  96. mainOverlay.translatesAutoresizingMaskIntoConstraints = false
  97. mainOverlay.setContentHuggingPriority(.defaultLow, for: .vertical)
  98. greetingLabel.font = .systemFont(ofSize: 32, weight: .bold)
  99. greetingLabel.textColor = Theme.primaryText
  100. greetingLabel.alignment = .center
  101. greetingLabel.maximumNumberOfLines = 1
  102. subtitleLabel.font = .systemFont(ofSize: 15, weight: .regular)
  103. subtitleLabel.textColor = Theme.secondaryText
  104. subtitleLabel.alignment = .center
  105. subtitleLabel.maximumNumberOfLines = 2
  106. let topInset = NSView()
  107. topInset.translatesAutoresizingMaskIntoConstraints = false
  108. topInset.heightAnchor.constraint(equalToConstant: 32).isActive = true
  109. configureInsightsCard()
  110. let titleBlock = NSStackView(views: [greetingLabel, subtitleLabel])
  111. titleBlock.orientation = .vertical
  112. titleBlock.spacing = 10
  113. titleBlock.alignment = .centerX
  114. let midSpacer = NSView()
  115. midSpacer.translatesAutoresizingMaskIntoConstraints = false
  116. midSpacer.heightAnchor.constraint(equalToConstant: 20).isActive = true
  117. let overlayBottomSpacer = NSView()
  118. overlayBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
  119. overlayBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
  120. overlayBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
  121. mainOverlay.addArrangedSubview(topInset)
  122. mainOverlay.addArrangedSubview(titleBlock)
  123. mainOverlay.addArrangedSubview(midSpacer)
  124. mainOverlay.addArrangedSubview(insightsCard)
  125. mainOverlay.addArrangedSubview(overlayBottomSpacer)
  126. sparkleView.translatesAutoresizingMaskIntoConstraints = false
  127. sparkleView.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 22, weight: .regular)
  128. sparkleView.image = NSImage(systemSymbolName: "sparkle", accessibilityDescription: "Accent")
  129. sparkleView.contentTintColor = NSColor(calibratedWhite: 0.9, alpha: 0.55)
  130. mainHost.addSubview(sparkleView)
  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. greetingLabel.leadingAnchor.constraint(equalTo: mainOverlay.leadingAnchor, constant: 24),
  153. greetingLabel.trailingAnchor.constraint(equalTo: mainOverlay.trailingAnchor, constant: -24),
  154. subtitleLabel.leadingAnchor.constraint(equalTo: greetingLabel.leadingAnchor),
  155. subtitleLabel.trailingAnchor.constraint(equalTo: greetingLabel.trailingAnchor),
  156. sparkleView.trailingAnchor.constraint(equalTo: mainHost.trailingAnchor, constant: -28),
  157. sparkleView.bottomAnchor.constraint(equalTo: mainHost.bottomAnchor, constant: -28)
  158. ])
  159. }
  160. private func configureInsightsCard() {
  161. insightsCard.wantsLayer = true
  162. insightsCard.layer?.backgroundColor = Theme.cardBackground.cgColor
  163. insightsCard.layer?.cornerRadius = 18
  164. insightsCard.translatesAutoresizingMaskIntoConstraints = false
  165. insightsTitleLabel.font = .systemFont(ofSize: 20, weight: .semibold)
  166. insightsTitleLabel.textColor = Theme.primaryText
  167. insightsTitleLabel.alignment = .center
  168. insightsTitleLabel.maximumNumberOfLines = 1
  169. insightsBodyLabel.font = .systemFont(ofSize: 13, weight: .regular)
  170. insightsBodyLabel.textColor = Theme.secondaryText
  171. insightsBodyLabel.alignment = .center
  172. insightsBodyLabel.maximumNumberOfLines = 4
  173. insightsBodyLabel.lineBreakMode = .byWordWrapping
  174. insightsBodyLabel.preferredMaxLayoutWidth = 400
  175. togglesLabel.font = .systemFont(ofSize: 12, weight: .medium)
  176. togglesLabel.textColor = Theme.tertiaryText
  177. togglesLabel.alignment = .center
  178. togglesLabel.maximumNumberOfLines = 1
  179. styleToggle(savedToggleButton)
  180. styleToggle(interviewsToggleButton)
  181. let toggleRow = NSStackView(views: [savedToggleButton, interviewsToggleButton])
  182. toggleRow.orientation = .horizontal
  183. toggleRow.spacing = 10
  184. toggleRow.alignment = .centerY
  185. let inner = NSStackView(views: [
  186. insightsTitleLabel,
  187. insightsBodyLabel,
  188. togglesLabel,
  189. toggleRow
  190. ])
  191. inner.orientation = .vertical
  192. inner.spacing = 10
  193. inner.alignment = .centerX
  194. inner.distribution = .fill
  195. inner.translatesAutoresizingMaskIntoConstraints = false
  196. insightsCard.setContentHuggingPriority(.defaultHigh, for: .vertical)
  197. insightsCard.addSubview(inner)
  198. NSLayoutConstraint.activate([
  199. inner.leadingAnchor.constraint(equalTo: insightsCard.leadingAnchor, constant: 32),
  200. inner.trailingAnchor.constraint(equalTo: insightsCard.trailingAnchor, constant: -32),
  201. inner.topAnchor.constraint(equalTo: insightsCard.topAnchor, constant: 22),
  202. inner.bottomAnchor.constraint(equalTo: insightsCard.bottomAnchor, constant: -22),
  203. insightsCard.widthAnchor.constraint(equalToConstant: 440)
  204. ])
  205. }
  206. private func styleToggle(_ button: NSButton) {
  207. button.bezelStyle = .rounded
  208. button.font = .systemFont(ofSize: 12, weight: .medium)
  209. button.contentTintColor = Theme.secondaryText
  210. button.wantsLayer = true
  211. button.layer?.backgroundColor = Theme.toggleBackground.cgColor
  212. button.layer?.cornerRadius = 8
  213. button.translatesAutoresizingMaskIntoConstraints = false
  214. button.widthAnchor.constraint(equalToConstant: 108).isActive = true
  215. button.heightAnchor.constraint(equalToConstant: 30).isActive = true
  216. }
  217. private func configureSidebar(_ items: [SidebarItem]) {
  218. sidebar.arrangedSubviews.forEach {
  219. sidebar.removeArrangedSubview($0)
  220. $0.removeFromSuperview()
  221. }
  222. let brand = NSTextField(labelWithString: "Indeed AI\nJob Finder")
  223. brand.font = .systemFont(ofSize: 18, weight: .bold)
  224. brand.textColor = Theme.primaryText
  225. brand.alignment = .left
  226. sidebar.addArrangedSubview(brand)
  227. let titleToMenuSpacer = NSView()
  228. titleToMenuSpacer.translatesAutoresizingMaskIntoConstraints = false
  229. titleToMenuSpacer.heightAnchor.constraint(equalToConstant: 24).isActive = true
  230. sidebar.addArrangedSubview(titleToMenuSpacer)
  231. items.enumerated().forEach { index, item in
  232. let row = NSStackView()
  233. row.orientation = .horizontal
  234. row.spacing = 8
  235. row.alignment = .centerY
  236. row.wantsLayer = true
  237. row.layer?.cornerRadius = 8
  238. row.edgeInsets = NSEdgeInsets(top: 8, left: 10, bottom: 8, right: 10)
  239. let isSelected = index == 0
  240. if isSelected {
  241. row.layer?.backgroundColor = Theme.selectionFill.cgColor
  242. }
  243. let icon = NSImageView()
  244. icon.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: 13, weight: .medium)
  245. icon.image = NSImage(systemSymbolName: item.systemImage, accessibilityDescription: item.title)
  246. icon.contentTintColor = isSelected ? Theme.primaryText : Theme.secondaryText
  247. let text = NSTextField(labelWithString: item.title)
  248. text.font = .systemFont(ofSize: 14, weight: .medium)
  249. text.textColor = isSelected ? Theme.primaryText : Theme.secondaryText
  250. row.addArrangedSubview(icon)
  251. row.addArrangedSubview(text)
  252. if let badge = item.badge {
  253. let badgeField = NSTextField(labelWithString: badge)
  254. badgeField.font = .systemFont(ofSize: 11, weight: .semibold)
  255. badgeField.textColor = Theme.primaryText
  256. badgeField.wantsLayer = true
  257. badgeField.layer?.backgroundColor = Theme.toggleBackground.cgColor
  258. badgeField.layer?.cornerRadius = 8
  259. badgeField.alignment = .center
  260. badgeField.maximumNumberOfLines = 1
  261. badgeField.lineBreakMode = .byClipping
  262. badgeField.translatesAutoresizingMaskIntoConstraints = false
  263. badgeField.widthAnchor.constraint(equalToConstant: 42).isActive = true
  264. row.addArrangedSubview(NSView())
  265. row.addArrangedSubview(badgeField)
  266. }
  267. sidebar.addArrangedSubview(row)
  268. }
  269. let sidebarBottomSpacer = NSView()
  270. sidebarBottomSpacer.translatesAutoresizingMaskIntoConstraints = false
  271. sidebarBottomSpacer.setContentHuggingPriority(.defaultLow, for: .vertical)
  272. sidebarBottomSpacer.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
  273. sidebar.addArrangedSubview(sidebarBottomSpacer)
  274. }
  275. private func updateDocumentLayout() {
  276. documentContainer.layoutSubtreeIfNeeded()
  277. let fittingHeight = max(chromeContainer.fittingSize.height, bounds.height)
  278. documentContainer.frame = NSRect(x: 0, y: 0, width: bounds.width, height: fittingHeight)
  279. }
  280. }