Merge pull request #947 from aziontech/dev

DEPLOY 2023.03.28

jsconfig.json

@@ -9,6 +9,7 @@
       "@stores/*": ["src/stores/*"],
       "@assets/*": ["src/assets/*"],
       "@routes/*": ["src/router/routes/*"],
+      "@modules/*": ["src/modules/*"]
     }
   },
   "exclude": ["node_modules", "dist"]

package.json

@@ -1,6 +1,6 @@
 {
   "name": "azion-platform-kit",
-  "version": "1.11.0",
+  "version": "1.12.0",
   "private": true,
   "type": "module",
   "repository": {

src/App.vue

@@ -5,7 +5,9 @@
   import { useAccountStore } from '@/stores/account'
   import { storeToRefs } from 'pinia'
   import { themeSelect } from '@/helpers'
-  /** @type {import('@/plugins/adapters/AnalyticsTrackerAdapter').AnalyticsTrackerAdapter} */
+  import '@modules/real-time-metrics/helpers/convert-date'
+  import '@/helpers/store-handler'
+  /** @type {import('@/plugins/analytics/AnalyticsTrackerAdapter').AnalyticsTrackerAdapter} */
   const tracker = inject('tracker')
 
   const accountStore = useAccountStore()

src/assets/icons/azionicons.scss

@@ -19,8 +19,92 @@
 
 /* Icons */
 .ai.ai-x::before {
-  content: '\0001';
+  content: '\ea02';
 }
 .ai.ai-column::before {
-  content: '\0002';
+  content: '\ea03';
+}
+.ai.ai-home::before {
+  content: '\ea04';
+}
+.ai.ai-marketplace::before {
+  content: '\ea05';
+}
+.ai.ai-domains::before {
+  content: '\ea06';
+}
+.ai.ai-edge-application::before {
+  content: '\ea08';
+}
+.ai.ai-build-pillar::before {
+  content: '\ea07';
+}
+.ai.ai-variables::before {
+  content: '\ea09';
+}
+.ai.ai-secure-pillar::before {
+  content: '\ea10';
+}
+.ai.ai-edge-firewall::before {
+  content: '\ea11';
+}
+.ai.ai-edge-dns::before {
+  content: '\ea12';
+}
+.ai.ai-deploy-pillar::before {
+  content: '\ea13';
+}
+.ai.ai-edge-nodes::before {
+  content: '\ea14';
+}
+.ai.ai-observe-pillar::before {
+  content: '\ea15';
+}
+.ai.ai-data-stream::before {
+  content: '\ea16';
+}
+.ai.ai-edge-pulse::before {
+  content: '\ea17';
+}
+.ai.ai-real-time-metrics::before {
+  content: '\ea18';
+}
+.ai.ai-real-time-events::before {
+  content: '\ea19';
+}
+.ai.ai-real-time-purge::before {
+  content: '\ea20';
+}
+.ai.ai-edge-libraries::before {
+  content: '\ea21';
+}
+.ai.ai-edge-functions::before {
+  content: '\ea22';
+}
+.ai.ai-edge-services::before {
+  content: '\ea23';
+}
+.ai.ai-digital-certificates::before {
+  content: '\ea24';
+}
+.ai.ai-network-lists::before {
+  content: '\ea25';
+}
+.ai.ai-waf-rules::before {
+  content: '\ea26';
+}
+.ai.ai-store::before {
+  content: '\ea27';
+}
+.ai.ai-edge-storage::before {
+  content: '\ea28';
+}
+.ai.ai-edge-sql::before {
+  content: '\ea29';
+}
+.ai.ai-edge-kv::before {
+  content: '\ea30';
+}
+.ai.ai-edge-orchestrator::before {
+  content: '\ea31';
 }

src/assets/main.css

@@ -22,6 +22,11 @@ body.p-overflow-hidden {
   overscroll-behavior: contain !important;
 }
 
+.grecaptcha-badge {
+  bottom: 75px !important;
+  z-index: 11;
+}
+
 #app {
   font-family: var(--font-family);
   text-rendering: optimizeLegibility;

src/assets/themes/scss/themes/azion-dark/variables/_form.scss

@@ -557,16 +557,16 @@ $editorContentBg: #ffffff;
 
 /// Background of a password meter
 /// @group form
-$passwordMeterBg: #dee2e6;
+$passwordMeterBg: var(--surface-400);
 
 /// Background of a week password
 /// @group form
 $passwordWeakBg: #e53935;
 
 /// Background of a medium password
 /// @group form
-$passwordMediumBg: #ffb300;
+$passwordMediumBg: #ffb64d;
 
 /// Background of a strong password
 /// @group form
-$passwordStrongBg: #43a047;
+$passwordStrongBg: #39e478;

src/assets/themes/scss/themes/azion-light/variables/_form.scss

@@ -557,16 +557,16 @@ $editorContentBg: #ffffff;
 
 /// Background of a password meter
 /// @group form
-$passwordMeterBg: #dee2e6;
+$passwordMeterBg: var(--surface-200);
 
 /// Background of a week password
 /// @group form
-$passwordWeakBg: #e53935;
+$passwordWeakBg: #ef4040;
 
 /// Background of a medium password
 /// @group form
-$passwordMediumBg: #ffb300;
+$passwordMediumBg: #c59707;
 
 /// Background of a strong password
 /// @group form
-$passwordStrongBg: #43a047;
+$passwordStrongBg: #16a34a;

src/helpers/account-expired.js

@@ -0,0 +1,12 @@
+import { getStaticUrlsByEnvironment } from '@/helpers'
+
+const statusToGoBilling = ['BLOCKED', 'DEFAULTING']
+
+const checkAccountStatus = (statusClient) => {
+  if (statusToGoBilling.includes(statusClient)) {
+    const billingUrl = getStaticUrlsByEnvironment('billing')
+    window.location.replace(billingUrl)
+  }
+}
+
+export default checkAccountStatus

src/helpers/convert-date.js

@@ -1,4 +1,5 @@
-const HOURS_TO_MSEC = 3_600_000
+const MINUTE_IN_MILLISECONDS = 60_000
+const HOUR_IN_MILLISECONDS = 3_600_000
 
 /**
  * Converts a given value to a date string in a specific format.
@@ -19,22 +20,6 @@ const convertValueToDate = (value) => {
   return date.toLocaleString('en-US', options)
 }
 
-/**
- * Remove the specified amount of hours from the given date
- *
- * @param {number} pOffset - The number of hours to remove
- * @param {Date} pDate - The date from which to remove the hours
- * @returns {Date} The new date after removing the specified hours
- */
-function removeSelectedAmountOfHours(pOffset, pDate) {
-  const offset = Number(pOffset)
-  const offsetTimestamp = offset * HOURS_TO_MSEC
-  const calculatedTimestamp = pDate.getTime() - offsetTimestamp
-  const calculatedDate = new Date(calculatedTimestamp)
-
-  return calculatedDate
-}
-
 /**
  * Formats a given date to ISO format without milliseconds.
  *
@@ -68,88 +53,20 @@ const convertOffsetToDecimal = (offset) => {
   return `${offsetSign}${hours}.${decimalMinutes}`
 }
 
-export {
-  removeSelectedAmountOfHours,
-  formatToEndOfDayIsoDate,
-  convertOffsetToDecimal,
-  convertValueToDate
-}
-
-/**
- * Set the current date to UTC0 and remove Timezone tag
- *
- * @returns {string} Date without timezone
- */
-Date.prototype.removeZone = function () {
-  const dateWithUserTimezone = this.toISOString()
-  const dateWithoutZone = dateWithUserTimezone.replace(/(\..+)/, '')
-  return dateWithoutZone
-}
-
-/**
- * Convert current date to the UTC informed
- *
- * @param {number} userUTC - The UTC offset to convert the date to
- * @returns {Date} The new date converted to the specified UTC
- */
-Date.prototype.toUTC = function (userUTC = 0) {
-  const tz = Number(userUTC)
-  const tzTimeStamp = (tz / 100) * HOURS_TO_MSEC
-  const dateWithUserTimezone = new Date(this.getTime() + tzTimeStamp)
-  const dateWithoutZone = dateWithUserTimezone.toBeholderFormat()
-  return new Date(dateWithoutZone)
-}
-
-/**
- * Reset the current date according to the specified UTC offset
- *
- * @param {number} userUTC - The UTC offset to reset the date to
- * @returns {Date} The new date reset to the specified UTC
- */
-Date.prototype.resetUTC = function (userUTC = 0) {
-  const regexpChangeUTC = /(.+)([+|-]\d+)(.+)/g
-  const injectUserUTC = this.toString().replace(regexpChangeUTC, `$1${userUTC}$3`)
-
-  return new Date(injectUserUTC)
-}
-
-/**
- * Format date as the Beholder standard
- *
- * @returns {string} Date in Beholder format
- */
-Date.prototype.toBeholderFormat = function () {
-  return this.toISOString().replace(/(\..+)/, '')
-}
-
-/**
- * Convert the date from the local format to the Beholder format
- *
- * @returns {string} Date in Beholder format
- */
-Date.prototype.fromLocaletoBeholderFormat = function () {
-  const toLocale = this.toLocaleString('en-GB')
-  const parts = toLocale.split(/\/|, /)
-  const day = parts[0]
-  const month = parts[1]
-  const year = parts[2]
-  const time = parts[3]
-
-  return `${year}-${month}-${day}T${time}`
-}
-
 /**
  * Converts the instance of Date to the local timezone based on the provided UTC offset.
  *
  * @param {string} utcOffset - The UTC offset for the desired timezone.
  * @returns {string} The date converted to the local timezone in ISO format.
  */
-Date.prototype.convertDateToLocalTimezone = function (utcOffset) {
+const convertDateToLocalTimezone = (date, utcOffset) => {
   const userOffset = convertOffsetToDecimal(utcOffset)
-  const timeZoneOffsetMinutesToMilli = this.getTimezoneOffset() * 60000
-  const toUTC = this.getTime() + timeZoneOffsetMinutesToMilli
-  const offsetHoursToMilli = userOffset * 3600000
+  const timeZoneOffsetMinutesToMilli = date.getTimezoneOffset() * MINUTE_IN_MILLISECONDS
+  const toUTC = date.getTime() + timeZoneOffsetMinutesToMilli
+  const offsetHoursToMilli = userOffset * HOUR_IN_MILLISECONDS
 
   const userRealDate = new Date(toUTC + offsetHoursToMilli)
   return formatToEndOfDayIsoDate(userRealDate)
 }
+
+export { convertValueToDate, convertDateToLocalTimezone }

src/helpers/index.js

@@ -17,6 +17,7 @@ import InviteSession from './invite-session'
 import { metricsPlaygroundOpener } from './metrics-playground-opener'
 import { parseCamelToSnake, parseSnakeToCamel } from './parse-api-body'
 import { themeSelect } from './theme-select'
+import { convertValueToDate, convertDateToLocalTimezone } from './convert-date'
 
 export {
   InviteSession,
@@ -37,5 +38,7 @@ export {
   openSearchResult,
   parseCamelToSnake,
   parseSnakeToCamel,
-  themeSelect
+  themeSelect,
+  convertValueToDate,
+  convertDateToLocalTimezone
 }

src/helpers/store-handler.js

@@ -0,0 +1,12 @@
+window.addEventListener('storage', handleStorageChange)
+
+function handleStorageChange(event) {
+  if (event.key !== '__user_traits') return
+
+  const { newValue, oldValue } = event
+  const isNewValueDifferent = JSON.parse(newValue).client_id !== JSON.parse(oldValue).client_id
+
+  if (isNewValueDifferent) {
+    window.location.reload()
+  }
+}