github.com/cockroachdb/cockroach@v20.2.0-alpha.1+incompatible/pkg/ui/ccl/src/views/clusterviz/containers/map/needEnterpriseLicense.tsx (about) 1 // Copyright 2018 The Cockroach Authors. 2 // 3 // Licensed as a CockroachDB Enterprise file under the Cockroach Community 4 // License (the "License"); you may not use this file except in compliance with 5 // the License. You may obtain a copy of the License at 6 // 7 // https://github.com/cockroachdb/cockroach/blob/master/licenses/CCL.txt 8 9 import React from "react"; 10 11 import step1Img from "assets/nodeMapSteps/1-getLicense.png"; 12 import step2Img from "assets/nodeMapSteps/2-setKey.svg"; 13 import step3Img from "assets/nodeMapSteps/3-seeMap.png"; 14 15 import { 16 NodeCanvasContainerOwnProps, 17 } from "src/views/clusterviz/containers/map/nodeCanvasContainer"; 18 import * as docsURL from "src/util/docs"; 19 import "./needEnterpriseLicense.styl"; 20 21 // This takes the same props as the NodeCanvasContainer which it is swapped out with. 22 23 function Step(props: { num: number, img: string, children: React.ReactNode }) { 24 return ( 25 <div className="license-step"> 26 <img src={props.img} className="license-step__image" /> 27 <div className="license-step__text"> 28 <span className="license-step__stepnum">Step {props.num}:</span>{" "} 29 {props.children} 30 </div> 31 </div> 32 ); 33 } 34 35 export default class NeedEnterpriseLicense extends React.Component<NodeCanvasContainerOwnProps> { 36 render() { 37 return ( 38 <section className="need-license"> 39 <div className="need-license-blurb"> 40 <div> 41 <h1 className="base-heading need-license-blurb__header">View the Node Map</h1> 42 <p className="need-license-blurb__text"> 43 The Node Map shows the geographical layout of your cluster, along 44 with metrics and health indicators. To enable the Node Map, 45 request an <a href={docsURL.enterpriseLicensing} target="_blank">Enterprise trial 46 license</a> and refer to this <a href={docsURL.enableNodeMap} target="_blank">configuration 47 guide</a>. 48 </p> 49 </div> 50 <a href={docsURL.startTrial} className="need-license-blurb__trial-link" target="_blank"> 51 GET A 30-DAY ENTERPRISE TRIAL 52 </a> 53 </div> 54 <div className="need-license-steps"> 55 <Step num={1} img={step1Img}> 56 <a href={docsURL.startTrial} target="_blank">Get a trial license</a> delivered straight to your inbox. 57 </Step> 58 <Step num={2} img={step2Img}> 59 Activate the trial license with two simple SQL commands. 60 </Step> 61 <Step num={3} img={step3Img}> 62 Follow <a href={docsURL.enableNodeMap} target="_blank">this guide</a> to configure localities 63 and locations. 64 </Step> 65 </div> 66 </section> 67 ); 68 } 69 }