Transformations: Add unary operations to Add field from calculation #75946

mdvictor · 2023-10-04T10:35:40Z

Screen.Recording.2023-10-04.at.13.33.00.mov

What is this feature?

Add unary operations to Add field from calculation transform, e.g: abs(), exp(), floor(), ceil()

Why do we need this feature?

Enhances functionality of the transformation

Who is this feature for?

Everyone

Which issue(s) does this PR fix?:

Fixes #74489

Special notes for your reviewer:

Please check that:

It works as expected from a user's perspective.
If this is a pre-GA feature, it is behind a feature toggle.
The docs are updated, and if this is a notable improvement, it's added to our What's New doc.

oscarkilhed

Nice! Was thinking the other day we should add this! Works well, but left some comments to make the code a bit nicer.

oscarkilhed · 2023-10-04T12:46:05Z

public/app/features/transformers/editors/CalculateFieldTransformerEditor.tsx

+      <div className="gf-form-inline">
+        <div className="gf-form">
+          <div className="gf-form-label width-8">Operation</div>
+        </div>
+        <div className="gf-form">
+          <Select
+            className="width-8 gf-form-spacing"
+            options={ops}
+            value={options.operator ?? ops[0].value}
+            onChange={this.onUnaryOperationChanged}
+          />
+          <div className="gf-form-label width-1">(</div>
+          <Select
+            placeholder="Field"
+            className="min-width-7 gf-form-spacing"
+            options={fieldName}
+            value={options?.fieldName}
+            onChange={this.onUnaryValueChanged}
+          />
+          <div className="gf-form-label width-1">)</div>
+        </div>
+      </div>


I would prefer if this was using the new form elements. Not sure how consistent it would look with the form for the binary operators, maybe it's not that big of a deal? Maybe it's time to change the binary form the the new form elements as well?

I agree! I'll look into that!

Modified the editor to now use new ui elements!

oscarkilhed · 2023-10-04T12:53:13Z

public/app/features/transformers/editors/CalculateFieldTransformerEditor.tsx

+    const { unary } = this.props.options;
+    this.updateUnaryOptions({
+      ...unary!,
+      operator: v.value! as UnaryOperationID,


We can avoid this as by using SelectableValue<UnaryOperationId>, adding a unaryOperationID property to the UnaryOperationInfo and using that property when we are constructing the options for the select.

Thank you! Will modify!

Modified this for both unary and binary editors!

imatwawana

Made a couple small suggestions.

imatwawana · 2023-10-04T14:28:42Z

docs/sources/panels-visualizations/query-transform-data/transform-data/index.md

+  - **Binary operation -** Apply basic binary operations(sum, multiply, etc) on values in a single row from two selected fields.
+  - **Unary operation -** Apply basic unary operations(abs, exp, floor, etc) on values in a single row from a selected field.


Suggested change

- **Binary operation -** Apply basic binary operations(sum, multiply, etc) on values in a single row from two selected fields.

- **Unary operation -** Apply basic unary operations(abs, exp, floor, etc) on values in a single row from a selected field.

- **Binary operation -** Apply basic binary operations (for example, sum or multiply) on values in a single row from two selected fields.

- **Unary operation -** Apply basic unary operations (for example, abs, exp, or floor) on values in a single row from a selected field.

imatwawana · 2023-10-04T14:29:10Z

docs/sources/panels-visualizations/query-transform-data/transform-data/index.md

  - **Row index -** Insert a field with the row index.
 - **Field name -** Select the names of fields you want to use in the calculation for the new field.
 - **Calculation -** If you select **Reduce row** mode, then the **Calculation** field appears. Click in the field to see a list of calculation choices you can use to create the new field. For information about available calculations, refer to [Calculation types][].
- **Operation -** If you select **Binary option** mode, then the **Operation** fields appear. These fields allow you to do basic math operations on values in a single row from two selected fields. You can also use numerical values for binary operations.
+- **Operation -** If you select **Binary operation** or **Unary operation** mode, then the **Operation** fields appear. These fields allow you to do basic math operations on values in a single row from selected fields. You can also use numerical values for binary operations.


Suggested change

- **Operation -** If you select **Binary operation** or **Unary operation** mode, then the **Operation** fields appear. These fields allow you to do basic math operations on values in a single row from selected fields. You can also use numerical values for binary operations.

- **Operation -** If you select **Binary operation** or **Unary operation** mode, then the **Operation** fields appear. These fields allow you to apply basic math operations on values in a single row from selected fields. You can also use numerical values for binary operations.

codeincarnate

Looks great! See my comments.

codeincarnate · 2023-10-04T16:10:02Z

docs/sources/panels-visualizations/query-transform-data/transform-data/index.md

@@ -108,11 +108,12 @@ Use this transformation to add a new field calculated from two other fields. Eac

 - **Mode -** Select a mode:
  - **Reduce row -** Apply selected calculation on each row of selected fields independently.
-  - **Binary option -** Apply basic math operation(sum, multiply, etc) on values in a single row from two selected fields.
+  - **Binary operation -** Apply basic binary operations(sum, multiply, etc) on values in a single row from two selected fields.


This is maybe a bit beyond the context of this PR but should it seems like we should include language about what these operators are. I'm assuming plenty of folks will know, but I'm guessing there are those that may be confused. What do you think?

I agree! I've added explanations to each of the new functions added. I think binary operations should be fine as they are since they are pretty self explanatory. @imatwawana can I please ask for another review of the docs with these new modifications? Thank you!

packages/grafana-data/src/utils/unaryOperators.ts

oscarkilhed

Nice! 🎉

imatwawana

Small wording tweak but otherwise, looks good!

imatwawana · 2023-10-05T13:27:49Z

docs/sources/panels-visualizations/query-transform-data/transform-data/index.md

+    - **Absolute value (abs)** - Returns the absolute value of the given expression. It represents it's distance from zero as a positive number.
+    - **Natural exponential (exp)** - Returns _e_ raised to the power of the given expression.
+    - **Natural logarithm (ln)** - Returns the natural logarithm of a given expression.
+    - **Floor (floor)** - Returns the largest integer less than or equal to the given expression.
+    - **Ceiling (ceil)** - Returns the smallest integer greater than or equal to the given expression.


Suggested change

- **Absolute value (abs)** - Returns the absolute value of the given expression. It represents it's distance from zero as a positive number.

- **Natural exponential (exp)** - Returns _e_ raised to the power of the given expression.

- **Natural logarithm (ln)** - Returns the natural logarithm of a given expression.

- **Floor (floor)** - Returns the largest integer less than or equal to the given expression.

- **Ceiling (ceil)** - Returns the smallest integer greater than or equal to the given expression.

- **Absolute value (abs)** - Returns the absolute value of a given expression. It represents its distance from zero as a positive number.

- **Natural exponential (exp)** - Returns _e_ raised to the power of a given expression.

- **Natural logarithm (ln)** - Returns the natural logarithm of a given expression.

- **Floor (floor)** - Returns the largest integer less than or equal to a given expression.

- **Ceiling (ceil)** - Returns the smallest integer greater than or equal to a given expression.

Much appreciated! Thank you!

codeincarnate

Looks great!

Add unary operations to add field from calc transform

7cfd1a4

mdvictor added add to changelog no-backport Skip backport of PR labels Oct 4, 2023

mdvictor added this to the 10.2.x milestone Oct 4, 2023

mdvictor requested review from grafanabot, a team and imatwawana as code owners October 4, 2023 10:35

mdvictor requested review from L-M-K-B, JoaoSilvaGrafana, academo, codeincarnate, oscarkilhed and baldm0mma and removed request for a team October 4, 2023 10:35

grafana-pr-automation bot added area/frontend type/docs labels Oct 4, 2023

oscarkilhed requested changes Oct 4, 2023

View reviewed changes

imatwawana approved these changes Oct 4, 2023

View reviewed changes

codeincarnate requested changes Oct 4, 2023

View reviewed changes

mdvictor added 4 commits October 5, 2023 11:20

Refactor layout to use new UI components. fix 'as' type assertions

37ebe51

rename exp

1e90a44

Merge branch 'main' into mdvictor/unary-operations-transform

a387134

more docs

ad8abba

mdvictor requested review from imatwawana, codeincarnate and oscarkilhed October 5, 2023 08:43

oscarkilhed approved these changes Oct 5, 2023

View reviewed changes

imatwawana approved these changes Oct 5, 2023

View reviewed changes

fix docs

513ba9d

codeincarnate approved these changes Oct 6, 2023

View reviewed changes

codeincarnate merged commit 8e57691 into main Oct 6, 2023
20 checks passed

codeincarnate deleted the mdvictor/unary-operations-transform branch October 6, 2023 14:44

zerok modified the milestones: 10.2.x, 10.2.0 Oct 23, 2023

dnhn mentioned this pull request Oct 24, 2023

grafana 10.2.0 Homebrew/homebrew-core#152264

Closed

BrewTestBot mentioned this pull request Oct 25, 2023

grafana 10.2.0 Homebrew/homebrew-core#152321

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Transformations: Add unary operations to Add field from calculation #75946

Transformations: Add unary operations to Add field from calculation #75946

mdvictor commented Oct 4, 2023

oscarkilhed left a comment

oscarkilhed Oct 4, 2023

mdvictor Oct 4, 2023

mdvictor Oct 5, 2023

oscarkilhed Oct 4, 2023

mdvictor Oct 4, 2023

mdvictor Oct 5, 2023

imatwawana left a comment

imatwawana Oct 4, 2023

imatwawana Oct 4, 2023

codeincarnate left a comment

codeincarnate Oct 4, 2023

mdvictor Oct 5, 2023

oscarkilhed left a comment

imatwawana left a comment

imatwawana Oct 5, 2023

mdvictor Oct 5, 2023

codeincarnate left a comment

		- Binary operation - Apply basic binary operations(sum, multiply, etc) on values in a single row from two selected fields.
		- Unary operation - Apply basic unary operations(abs, exp, floor, etc) on values in a single row from a selected field.

	- Operation - If you select Binary operation or Unary operation mode, then the Operation fields appear. These fields allow you to do basic math operations on values in a single row from selected fields. You can also use numerical values for binary operations.
	- Operation - If you select Binary operation or Unary operation mode, then the Operation fields appear. These fields allow you to apply basic math operations on values in a single row from selected fields. You can also use numerical values for binary operations.

Transformations: Add unary operations to Add field from calculation #75946

Transformations: Add unary operations to Add field from calculation #75946

Conversation

mdvictor commented Oct 4, 2023

oscarkilhed left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

imatwawana left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

codeincarnate left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

oscarkilhed left a comment

Choose a reason for hiding this comment

imatwawana left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

codeincarnate left a comment

Choose a reason for hiding this comment