From ee85eec6a185d66c36af6644bc8a1623318aa6b2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jakub=20Bedn=C3=A1=C5=99?= Date: Thu, 23 Jan 2020 23:32:32 +0100 Subject: [PATCH] feat(clientLibs): add Ruby client library to Client Page (#16617) * doc(clientLibs): add actual version of Java client * feat(clientLibs): add Ruby client library * feat(clientLibs): add Ruby client library Co-authored-by: Russ Savage --- .../components/ClientRubyOverlay.tsx | 125 ++++++++++++++++++ ui/src/clientLibraries/constants/index.ts | 43 +++++- ui/src/index.tsx | 5 + 3 files changed, 171 insertions(+), 2 deletions(-) create mode 100644 ui/src/clientLibraries/components/ClientRubyOverlay.tsx diff --git a/ui/src/clientLibraries/components/ClientRubyOverlay.tsx b/ui/src/clientLibraries/components/ClientRubyOverlay.tsx new file mode 100644 index 0000000000..ef7a88cb08 --- /dev/null +++ b/ui/src/clientLibraries/components/ClientRubyOverlay.tsx @@ -0,0 +1,125 @@ +// Libraries +import React, {FunctionComponent} from 'react' +import {connect} from 'react-redux' + +// Components +import ClientLibraryOverlay from 'src/clientLibraries/components/ClientLibraryOverlay' +import TemplatedCodeSnippet from 'src/shared/components/TemplatedCodeSnippet' + +// Constants +import {clientRubyLibrary} from 'src/clientLibraries/constants' + +// Selectors +import {getOrg} from 'src/organizations/selectors' + +// Types +import {AppState} from 'src/types' + +interface StateProps { + org: string +} + +type Props = StateProps + +const ClientRubyOverlay: FunctionComponent = props => { + const { + name, + url, + initializeGemCodeSnippet, + initializeClientCodeSnippet, + writingDataLineProtocolCodeSnippet, + writingDataPointCodeSnippet, + writingDataHashCodeSnippet, + writingDataBatchCodeSnippet, + } = clientRubyLibrary + const {org} = props + const server = window.location.origin + + return ( + +

+ For more detailed and up to date information check out the{' '} + + GitHub Repository + +

+
Install the Gem
+ +
Initialize the Client
+ +
Write Data
+

Option 1: Use InfluxDB Line Protocol to write data

+ +

Option 2: Use a Data Point to write data

+ +

Option 3: Use a Hash to write data

+ +

Option 4: Use a Batch Sequence to write data

+ + + ) +} + +const mstp = (state: AppState): StateProps => { + const {id} = getOrg(state) + + return { + org: id, + } +} + +export {ClientRubyOverlay} +export default connect( + mstp, + null +)(ClientRubyOverlay) diff --git a/ui/src/clientLibraries/constants/index.ts b/ui/src/clientLibraries/constants/index.ts index ae2ee0f87f..65b734e013 100644 --- a/ui/src/clientLibraries/constants/index.ts +++ b/ui/src/clientLibraries/constants/index.ts @@ -4,6 +4,7 @@ import GoLogo from '../graphics/GoLogo' import JavaLogo from '../graphics/JavaLogo' import JSLogo from '../graphics/JSLogo' import PythonLogo from '../graphics/PythonLogo' +import RubyLogo from '../graphics/RubyLogo' export interface ClientLibrary { id: string @@ -107,10 +108,10 @@ export const clientJavaLibrary = { buildWithMavenCodeSnippet: ` com.influxdb influxdb-client-java - 1.1.0 + 1.4.0 `, buildWithGradleCodeSnippet: `dependencies { - compile "com.influxdb:influxdb-client-java:1.1.0" + compile "com.influxdb:influxdb-client-java:1.4.0" }`, initializeClientCodeSnippet: `package example; @@ -198,10 +199,48 @@ write_client.write("<%= bucket %>", "<%= org %>", point)`, write_client.write("<%= bucket %>", "<%= org %>", sequence)`, } +export const clientRubyLibrary = { + id: 'ruby', + name: 'Ruby', + url: 'https://github.com/influxdata/influxdb-client-ruby', + image: RubyLogo, + initializeGemCodeSnippet: `gem install influxdb-client -v 1.0.0.beta`, + initializeClientCodeSnippet: `## You can generate a Token from the "Tokens Tab" in the UI +client = InfluxDB2::Client.new('<%= server %>', '<%= token %>')`, + writingDataLineProtocolCodeSnippet: `data = 'mem,host=host1 used_percent=23.43234543 1556896326' +write_client.write(data: data, bucket: '<%= bucket %>', org: '<%= org %>')`, + writingDataPointCodeSnippet: `point = InfluxDB2::Point.new(name: 'mem') + .add_tag('host', 'host1') + .add_field('used_percent', 23.43234543) + .time(1_556_896_326, WritePrecision.NS) + +write_client.write(data: point, bucket: '<%= bucket %>', org: '<%= org %>')`, + writingDataHashCodeSnippet: `hash = { name: 'h2o', + tags: { host: 'aws', region: 'us' }, + fields: { level: 5, saturation: '99%' }, + time: 123 } + +write_client.write(data: hash, bucket: '<%= bucket %>', org: '<%= org %>')`, + writingDataBatchCodeSnippet: `point = InfluxDB2::Point.new(name: 'mem') + .add_tag('host', 'host1') + .add_field('used_percent', 23.43234543) + .time(1_556_896_326, WritePrecision.NS) + +hash = { name: 'h2o', + tags: { host: 'aws', region: 'us' }, + fields: { level: 5, saturation: '99%' }, + time: 123 } + +data = 'mem,host=host1 used_percent=23.43234543 1556896326' + +write_client.write(data: [point, hash, data], bucket: '<%= bucket %>', org: '<%= org %>')`, +} + export const clientLibraries: ClientLibrary[] = [ clientCSharpLibrary, clientGoLibrary, clientJavaLibrary, clientJSLibrary, clientPythonLibrary, + clientRubyLibrary, ] diff --git a/ui/src/index.tsx b/ui/src/index.tsx index 11f64c135c..235ca472cc 100644 --- a/ui/src/index.tsx +++ b/ui/src/index.tsx @@ -52,6 +52,7 @@ import ClientGoOverlay from 'src/clientLibraries/components/ClientGoOverlay' import ClientJavaOverlay from 'src/clientLibraries/components/ClientJavaOverlay' import ClientJSOverlay from 'src/clientLibraries/components/ClientJSOverlay' import ClientPythonOverlay from 'src/clientLibraries/components/ClientPythonOverlay' +import ClientRubyOverlay from 'src/clientLibraries/components/ClientRubyOverlay' import TemplateImportOverlay from 'src/templates/components/TemplateImportOverlay' import TemplateExportOverlay from 'src/templates/components/TemplateExportOverlay' import VariablesIndex from 'src/variables/containers/VariablesIndex' @@ -349,6 +350,10 @@ class Root extends PureComponent { path="python" component={ClientPythonOverlay} /> +