App.spec.tsx.snap 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454
  1. // Jest Snapshot v1, https://goo.gl/fbAQLP
  2. exports[`App view matches snapshot 1`] = `
  3. <Provider
  4. store={
  5. Object {
  6. "@@observable": [Function],
  7. "dispatch": [Function],
  8. "getState": [Function],
  9. "replaceReducer": [Function],
  10. "subscribe": [Function],
  11. }
  12. }
  13. >
  14. <StaticRouter>
  15. <Router
  16. history={
  17. Object {
  18. "action": "POP",
  19. "block": [Function],
  20. "createHref": [Function],
  21. "go": [Function],
  22. "goBack": [Function],
  23. "goForward": [Function],
  24. "listen": [Function],
  25. "location": Object {
  26. "hash": "",
  27. "pathname": "/",
  28. "search": "",
  29. "state": undefined,
  30. },
  31. "push": [Function],
  32. "replace": [Function],
  33. }
  34. }
  35. staticContext={Object {}}
  36. >
  37. <App
  38. alerts={Array []}
  39. clusters={Array []}
  40. fetchClustersList={
  41. [MockFunction] {
  42. "calls": Array [
  43. Array [],
  44. ],
  45. "results": Array [
  46. Object {
  47. "type": "return",
  48. "value": undefined,
  49. },
  50. ],
  51. }
  52. }
  53. isClusterListFetched={true}
  54. >
  55. <Component
  56. theme={
  57. Object {
  58. "buttonStyles": Object {
  59. "fontSize": Object {
  60. "L": "16px",
  61. "M": "14px",
  62. "S": "14px",
  63. },
  64. "height": Object {
  65. "L": "40px",
  66. "M": "32px",
  67. "S": "24px",
  68. },
  69. "primary": Object {
  70. "backgroundColor": Object {
  71. "active": "#1414B8",
  72. "hover": "#1717CF",
  73. "normal": "#4F4FFF",
  74. },
  75. "color": "#FFFFFF",
  76. "invertedColors": Object {
  77. "active": "#1414B8",
  78. "hover": "#1717CF",
  79. "normal": "#4F4FFF",
  80. },
  81. },
  82. "secondary": Object {
  83. "backgroundColor": Object {
  84. "active": "#D5DADD",
  85. "hover": "#E3E6E8",
  86. "normal": "#F1F2F3",
  87. },
  88. "color": "#171A1C",
  89. "invertedColors": Object {
  90. "active": "#171A1C",
  91. "hover": "#454F54",
  92. "normal": "#73848C",
  93. },
  94. },
  95. },
  96. "liStyles": Object {
  97. "primary": Object {
  98. "backgroundColor": Object {
  99. "active": "#E3E6E8",
  100. "hover": "#F1F2F3",
  101. "normal": "#FFFFFF",
  102. },
  103. "color": Object {
  104. "active": "#171A1C",
  105. "hover": "#F1F2F3",
  106. "normal": "#73848C",
  107. },
  108. },
  109. },
  110. "secondaryTabStyles": Object {
  111. "backgroundColor": Object {
  112. "active": "#E3E6E8",
  113. "hover": "#F1F2F3",
  114. "normal": "#FFFFFF",
  115. },
  116. "color": Object {
  117. "active": "#171A1C",
  118. "hover": "#171A1C",
  119. "normal": "#73848C",
  120. },
  121. },
  122. }
  123. }
  124. >
  125. <div
  126. className="Layout"
  127. >
  128. <nav
  129. aria-label="main navigation"
  130. className="navbar is-fixed-top is-white Layout__header"
  131. role="navigation"
  132. >
  133. <div
  134. className="navbar-brand"
  135. >
  136. <div
  137. className="navbar-burger ml-0"
  138. onClick={[Function]}
  139. onKeyDown={[Function]}
  140. role="button"
  141. tabIndex={0}
  142. >
  143. <span />
  144. <span />
  145. <span />
  146. </div>
  147. <a
  148. className="navbar-item title is-5 is-marginless"
  149. href="/ui"
  150. >
  151. UI for Apache Kafka
  152. </a>
  153. <div
  154. className="navbar-item"
  155. >
  156. <Version />
  157. </div>
  158. </div>
  159. </nav>
  160. <main
  161. className="Layout__container"
  162. >
  163. <div
  164. className="Layout__sidebar has-shadow has-background-white"
  165. >
  166. <Nav
  167. clusters={Array []}
  168. isClusterListFetched={true}
  169. >
  170. <aside
  171. className="menu has-shadow has-background-white"
  172. >
  173. <p
  174. className="menu-label"
  175. >
  176. General
  177. </p>
  178. <ul
  179. className="menu-list"
  180. >
  181. <li>
  182. <NavLink
  183. activeClassName="is-active"
  184. exact={true}
  185. title="Dashboard"
  186. to="/ui"
  187. >
  188. <Link
  189. aria-current={null}
  190. title="Dashboard"
  191. to={
  192. Object {
  193. "hash": "",
  194. "pathname": "/ui",
  195. "search": "",
  196. "state": null,
  197. }
  198. }
  199. >
  200. <LinkAnchor
  201. aria-current={null}
  202. href="/ui"
  203. navigate={[Function]}
  204. title="Dashboard"
  205. >
  206. <a
  207. aria-current={null}
  208. href="/ui"
  209. onClick={[Function]}
  210. title="Dashboard"
  211. >
  212. Dashboard
  213. </a>
  214. </LinkAnchor>
  215. </Link>
  216. </NavLink>
  217. </li>
  218. </ul>
  219. <p
  220. className="menu-label"
  221. >
  222. Clusters
  223. </p>
  224. </aside>
  225. </Nav>
  226. </div>
  227. <div
  228. aria-hidden="true"
  229. className="Layout__sidebarOverlay is-overlay"
  230. onClick={[Function]}
  231. onKeyDown={[Function]}
  232. tabIndex={-1}
  233. />
  234. <Switch>
  235. <Route
  236. component={[Function]}
  237. computedMatch={
  238. Object {
  239. "isExact": true,
  240. "params": Object {},
  241. "path": "/",
  242. "url": "/",
  243. }
  244. }
  245. exact={true}
  246. location={
  247. Object {
  248. "hash": "",
  249. "pathname": "/",
  250. "search": "",
  251. "state": undefined,
  252. }
  253. }
  254. path={
  255. Array [
  256. "/",
  257. "/ui",
  258. "/ui/clusters",
  259. ]
  260. }
  261. >
  262. <Dashboard
  263. history={
  264. Object {
  265. "action": "POP",
  266. "block": [Function],
  267. "createHref": [Function],
  268. "go": [Function],
  269. "goBack": [Function],
  270. "goForward": [Function],
  271. "listen": [Function],
  272. "location": Object {
  273. "hash": "",
  274. "pathname": "/",
  275. "search": "",
  276. "state": undefined,
  277. },
  278. "push": [Function],
  279. "replace": [Function],
  280. }
  281. }
  282. location={
  283. Object {
  284. "hash": "",
  285. "pathname": "/",
  286. "search": "",
  287. "state": undefined,
  288. }
  289. }
  290. match={
  291. Object {
  292. "isExact": true,
  293. "params": Object {},
  294. "path": "/",
  295. "url": "/",
  296. }
  297. }
  298. staticContext={Object {}}
  299. >
  300. <div
  301. className="section"
  302. >
  303. <div
  304. className="level"
  305. >
  306. <div
  307. className="level-item level-left"
  308. >
  309. <Breadcrumb>
  310. <nav
  311. aria-label="breadcrumbs"
  312. className="breadcrumb"
  313. >
  314. <ul>
  315. <li
  316. className="is-active"
  317. >
  318. <span
  319. className=""
  320. >
  321. Dashboard
  322. </span>
  323. </li>
  324. </ul>
  325. </nav>
  326. </Breadcrumb>
  327. </div>
  328. </div>
  329. <Connect(ClustersWidget)>
  330. <ClustersWidget
  331. clusters={Array []}
  332. dispatch={[Function]}
  333. offlineClusters={Array []}
  334. onlineClusters={Array []}
  335. >
  336. <div>
  337. <h5
  338. className="title is-5"
  339. >
  340. Clusters
  341. </h5>
  342. <MetricsWrapper>
  343. <div
  344. className="box"
  345. >
  346. <div
  347. className="level"
  348. >
  349. <Indicator
  350. label="Online Clusters"
  351. >
  352. <div
  353. className="level-item"
  354. >
  355. <div
  356. title="Online Clusters"
  357. >
  358. <p
  359. className="heading"
  360. >
  361. Online Clusters
  362. </p>
  363. <p
  364. className="title has-text-centered"
  365. >
  366. <span
  367. className="tag is-success"
  368. >
  369. 0
  370. </span>
  371. </p>
  372. </div>
  373. </div>
  374. </Indicator>
  375. <Indicator
  376. label="Offline Clusters"
  377. >
  378. <div
  379. className="level-item"
  380. >
  381. <div
  382. title="Offline Clusters"
  383. >
  384. <p
  385. className="heading"
  386. >
  387. Offline Clusters
  388. </p>
  389. <p
  390. className="title has-text-centered"
  391. >
  392. <span
  393. className="tag is-danger"
  394. >
  395. 0
  396. </span>
  397. </p>
  398. </div>
  399. </div>
  400. </Indicator>
  401. <Indicator
  402. label="Hide online clusters"
  403. >
  404. <div
  405. className="level-item"
  406. >
  407. <div
  408. title="Hide online clusters"
  409. >
  410. <p
  411. className="heading"
  412. >
  413. Hide online clusters
  414. </p>
  415. <p
  416. className="title has-text-centered"
  417. >
  418. <input
  419. checked={false}
  420. className="switch is-rounded"
  421. id="switchRoundedDefault"
  422. name="switchRoundedDefault"
  423. onChange={[Function]}
  424. type="checkbox"
  425. />
  426. <label
  427. htmlFor="switchRoundedDefault"
  428. />
  429. </p>
  430. </div>
  431. </div>
  432. </Indicator>
  433. </div>
  434. </div>
  435. </MetricsWrapper>
  436. </div>
  437. </ClustersWidget>
  438. </Connect(ClustersWidget)>
  439. </div>
  440. </Dashboard>
  441. </Route>
  442. </Switch>
  443. </main>
  444. <div
  445. className="Layout__alerts"
  446. />
  447. </div>
  448. </Component>
  449. </App>
  450. </Router>
  451. </StaticRouter>
  452. </Provider>
  453. `;