Common Code Snippets and Explanations

In software development, code snippets are often used to perform specific tasks or calculations.

In the context of the webpage app, the code snippets' syntax can vary based on the source and usage of variables.

Depending on where the code is placed, different contexts are utilized to access variables from various sources. Here's an overview of how to adapt the code snippets according to the variable context:

ContextVariable SourceExplanation
{{result.value}}Query ResponseThe result. context is used to access variables obtained from query responses. For instance, result["EmailConnector"] references an array from the EmailConnector key in the query response.
{{item.value}}Response ArrayThe item. context is employed when working with individual objects within an array response. For example, item.dateMs corresponds to the dateMs property of an object within an array.
{{app.value}}Side Panel ContextThe app. context is applied to context variables relevant to the side panel. It allows access to variables related to the side panel's specific context.
{{widget['id'].value}}Widget ValueSometimes, you can directly utilize the value of a widget without any context. This is useful for obtaining values directly from widgets on the webpage.
{{self.value}}KPI Widget Valueself.value is used to retrieve the value of a Key Performance Indicator (KPI) widget. This value can then be used in various calculations or displays.
{{ self.<value_name> }}Widget's Own Contextself.<value_name> is utilized to refer to variables specific to the widget itself. For example,{{ moment(self.min).format('lll') }} accesses the min variable within the same widget's context using the moment library to give an specific date format.
[[ ]]Widget Array ValuesSometimes, you can directly utilize the selected values of a widget without any context. This is useful for obtaining an array values directly from widgets on the webpage.

Keep in mind that these contexts are crucial for correctly referencing and accessing variables from different parts of the webpage.

This table provides an overview of various code snippets along with their explanations. These snippets are frequently encountered in different contexts, such as formatting data, calculating averages, working with timestamps, and more. Each snippet is followed by a clear explanation to help you understand its purpose and functionality. Whether you're a developer looking to understand these snippets or someone seeking to document their usage, this table offers concise explanations to aid your understanding.

Code SnippetExplanation
{{result["EmailConnector"] ? result["EmailConnector"].reduce((acc, connector) => acc + connector.count, 0) : 0}}Calculates the total count of emails by summing the count property of each object in the EmailConnector array within the result object. If the array is missing, the count defaults to 0.
{{formatNumber(self.value, {optionalMantissa: true}).toUpperCase()}}Formats the numeric value self.value using the formatNumber function with an optional mantissa and converts the result to uppercase.
{{formatNumber(self.value || 0, {optionalMantissa: true}).toUpperCase()}}Formats the numeric value self.value (or 0 if not available) using the formatNumber function, allowing an optional mantissa, and converts the result to uppercase.
{{formatBytes(self.value || 0,{base:'binary' ,optionalMantissa:true}).replace('i','')}}Formats the given byte size (self.value or 0) using binary-based units with an optional mantissa, then removes the 'i' character for clarity.
{{ / 1000 /}}Computes the average processing time per item by dividing the total processing time (in milliseconds) by the total count of items. This snippet can change depending on the API structure.
{{formatNumber(self.value)}} sFormats the numeric value self.value and appends 's' to indicate seconds.
{{moment(item.dateMs).tz(timezone).format('lll')}}Formats the timestamp, in this case the variable item.dateMs, into a human-readable localized date and time format using the moment library.
{{moment(app.startDate, 'YYYY-MM-DD').add(1, 'day').format('YYYY-MM-DD')}}Calculates a new date by adding one day, in this case to the variable app.startDate, then formats it as 'YYYY-MM-DD' using the moment library.
{{moment(result.sanitizedItem.details.processStartTime) .tz(timezone).format('lll')}}Formats the variable processStartTime timestamp from sanitizedItem.details into a readable localized date and time format using the moment library.
{{value === 'undefined' || value === 'null' ? '-' : value}}\Checks if value\ is 'undefined' or 'null', displaying a hyphen ('-') if true, otherwise showing the actual value.
{{item.severity === 2 ? '#22c55e' : '#fbbf24'}}Checks if item.severity is 2. If true, displays color '#22c55e', otherwise, displays '#fbbf24'.
{{item.threats.length || 0}} Suspicious Objects Detected\Displays the count of detected threats in item. If no threats are detected, it shows '0 Suspicious Objects Detected'.
{{numbro(moment.duration(moment(item.processEndTime) .diff(item.processStartTime)).asSeconds()).format({trimMantissa: true, mantissa: 1 })}} sec Sanitization TimeCalculates the duration between item.processStartTime and item.processEndTime, converts it to seconds, and formats it with a single decimal digit using the numbro library. Adds 'sec Sanitization Time'.
{{item.status !== 'OK' ? 'Blocked' : ''}}Displays 'Blocked' if item.status is not 'OK', otherwise displays an empty string.
{{item.hasThreats ? 'Suspicious' : ''}}Displays 'Suspicious' if item.hasThreats is true, otherwise shows an empty string.
/url?{{ widget['id']? => 'ArrayMap='+e).join('&') }}Maps the widget selected values as an array for the url query.