fix: sentry UI issues

web/src/components/DateTime.vue

@@ -592,29 +592,37 @@ export default defineComponent({
 
  const getConsumableDateTime = () => {
  if (selectedType.value == "relative") {
- let period = getPeriodLabel.value.toLowerCase();
- let periodValue = relativeValue.value;
-
- // quasar does not support arithmetic on weeks. convert to days.
- if (relativePeriod.value === "w") {
- period = "days";
- periodValue = periodValue * 7;
- }
+ try {
+ let period = getPeriodLabel.value.toLowerCase();
+ let periodValue = relativeValue.value;
+
+ // quasar does not support arithmetic on weeks. convert to days.
+ if (relativePeriod.value === "w") {
+ period = "days";
+ periodValue = periodValue * 7;
+ }
 
- const subtractObject = '{"' + period + '":' + periodValue + "}";
+  const subtractObject = '{"' + period + '":' + periodValue + "}";
 
- const endTimeStamp = new Date();
+  const endTimeStamp = new Date();
 
- const startTimeStamp = date.subtractFromDate(
- endTimeStamp,
- JSON.parse(subtractObject)
- );
+  const startTimeStamp = date.subtractFromDate(
+  endTimeStamp,
+  JSON.parse(subtractObject)
+  );
 
- return {
- startTime: new Date(startTimeStamp).getTime() * 1000,
- endTime: new Date(endTimeStamp).getTime() * 1000,
- relativeTimePeriod: relativeValue.value + relativePeriod.value,
- };
+ return {
+ startTime: new Date(startTimeStamp).getTime() * 1000,
+ endTime: new Date(endTimeStamp).getTime() * 1000,
+ relativeTimePeriod: relativeValue.value + relativePeriod.value,
+ };
+ } catch (err) {
+ return {
+ startTime: null,
+ endTime: null,
+ relativeTimePeriod: null,
+ };
+ }
  } else {
  if (typeof selectedDate.value === "string") {
  selectedDate.value = {
@@ -627,16 +635,41 @@ export default defineComponent({
  if (!selectedDate.value?.from && !selectedTime.value?.startTime) {
  start = new Date();
  } else {
+ const currDate = new Date();
+ let dateString;
+ if (!selectedDate.value.from) {
+ dateString =
+ currDate.getFullYear +
+ "/" +
+ currDate.getMonth +
+ "/" +
+ currDate.getDate;
+ }
+
  start = new Date(
- selectedDate.value.from + " " + selectedTime.value.startTime
+ (selectedDate.value?.from || dateString) +
+ " " +
+ (selectedTime.value.startTime || "00:00")
  );
  }
 
  if (selectedDate.value?.to == "" && selectedTime.value?.endTime == "") {
  end = new Date();
  } else {
+ const currDate = new Date();
+ let dateString;
+ if (!selectedDate.value.from) {
+ dateString =
+ currDate.getFullYear +
+ "/" +
+ currDate.getMonth +
+ "/" +
+ currDate.getDate;
+ }
  end = new Date(
- selectedDate.value.to + " " + selectedTime.value.endTime
+ (selectedDate.value?.to || dateString) +
+ " " +
+ (selectedTime.value.endTime || "23:59")
  );
  }
 
@@ -655,7 +688,6 @@ export default defineComponent({
  selectedDate: JSON.parse(JSON.stringify(selectedDate.value)),
  selectedTime: JSON.parse(JSON.stringify(selectedTime.value)),
  };
- // console.log(rVal)
  return rVal;
  }
  };

web/src/components/QueryEditor.vue

@@ -271,7 +271,9 @@ export default defineComponent({
  let filteredSuggestions = [];
  filteredSuggestions = createDependencyProposals(range);
  filteredSuggestions = filteredSuggestions.filter((item) => {
- return item.label.toLowerCase().includes(word.word.toLowerCase());
+ return item.label
+ ?.toLowerCase()
+ ?.includes(word?.word?.toLowerCase() || "");
  });
 
  // if (filteredSuggestions.length == 0) {

web/src/components/alerts/AlertList.vue

@@ -353,7 +353,7 @@ export default defineComponent({
  "name",
  false,
  "",
- store.state.selectedOrganization.identifier
+ store.state.selectedOrganization?.identifier
  )
  .then((res) => {
  var counter = 1;
@@ -434,7 +434,7 @@ export default defineComponent({
  const getDestinations = () => {
  destinationService
  .list({
- org_identifier: store.state.selectedOrganization.identifier,
+ org_identifier: store.state.selectedOrganization?.identifier,
  })
  .then((res) => {
  destinations.value = res.data;
@@ -451,7 +451,7 @@ export default defineComponent({
  const getTemplates = () => {
  templateService
  .list({
- org_identifier: store.state.selectedOrganization.identifier,
+ org_identifier: store.state.selectedOrganization?.identifier,
  })
  .then((res) => {
  templates.value = res.data;
@@ -501,7 +501,7 @@ export default defineComponent({
  name: "alertList",
  query: {
  action: "add",
- org_identifier: store.state.selectedOrganization.identifier,
+ org_identifier: store.state.selectedOrganization?.identifier,
  },
  });
  } else {
@@ -512,15 +512,15 @@ export default defineComponent({
  query: {
  action: "update",
  name: props.row.name,
- org_identifier: store.state.selectedOrganization.identifier,
+ org_identifier: store.state.selectedOrganization?.identifier,
  },
  });
  }
  addAlert();
  if (config.enableAnalytics == "true") {
  segment.track("Button Click", {
  button: action,
- user_org: store.state.selectedOrganization.identifier,
+ user_org: store.state.selectedOrganization?.identifier,
  user_id: store.state.userInfo.email,
  page: "Alerts",
  });
@@ -535,14 +535,14 @@ export default defineComponent({
  router.push({
  name: "alertList",
  query: {
- org_identifier: store.state.selectedOrganization.identifier,
+ org_identifier: store.state.selectedOrganization?.identifier,
  },
  });
  };
  const deleteAlert = () => {
  alertsService
  .delete(
- store.state.selectedOrganization.identifier,
+ store.state.selectedOrganization?.identifier,
  selectedDelete.value.stream_name,
  selectedDelete.value.name,
  selectedDelete.value.stream_type
@@ -573,7 +573,7 @@ export default defineComponent({
  if (config.enableAnalytics == "true") {
  segment.track("Button Click", {
  button: "Delete Alert",
- user_org: store.state.selectedOrganization.identifier,
+ user_org: store.state.selectedOrganization?.identifier,
  user_id: store.state.userInfo.email,
  alert_name: selectedDelete.value.name,
  page: "Alerts",
@@ -592,7 +592,7 @@ export default defineComponent({
  ) as Alert;
  alertsService
  .toggleState(
- store.state.selectedOrganization.identifier,
+ store.state.selectedOrganization?.identifier,
  alert.stream_name,
  alert.name,
  !alert?.enabled,
@@ -614,7 +614,7 @@ export default defineComponent({
  name: name,
  query: {
  action: "add",
- org_identifier: store.state.selectedOrganization.identifier,
+ org_identifier: store.state.selectedOrganization?.identifier,
  },
  });
  };

web/src/components/iam/roles/PermissionsJSON.vue

@@ -276,7 +276,9 @@ export default defineComponent({
  let filteredSuggestions = [];
  filteredSuggestions = createDependencyProposals(range);
  filteredSuggestions = filteredSuggestions.filter((item) => {
- return item.label.toLowerCase().includes(word.word.toLowerCase());
+ return item.label
+ ?.toLowerCase()
+ ?.includes(word?.word?.toLowerCase());
  });
 
  // if (filteredSuggestions.length == 0) {

web/src/composables/useLogs.ts

@@ -190,7 +190,8 @@ const useLogs = () => {
  const fieldValues = ref();
  const initialQueryPayload: Ref<LogsQueryPayload | null> = ref(null);
 
- searchObj.organizationIdetifier = store.state.selectedOrganization.identifier;
+ searchObj.organizationIdetifier =
+ store.state.selectedOrganization?.identifier;
 
  const resetSearchObj = () => {
  // searchObj = reactive(Object.assign({}, defaultObject));
@@ -1248,7 +1249,7 @@ const useLogs = () => {
  .catch((err) => {
  searchObj.loading = false;
  if (err.response != undefined) {
- searchObj.data.errorMsg = err.response.data.error;
+ searchObj.data.errorMsg = err.response.data?.error;
  } else {
  searchObj.data.errorMsg = err.message;
  }
@@ -1314,7 +1315,7 @@ const useLogs = () => {
  .catch((err) => {
  searchObj.loadingHistogram = false;
  if (err.response != undefined) {
- searchObj.data.histogram.errorMsg = err.response.data.error;
+ searchObj.data.histogram.errorMsg = err.response.data?.error;
  } else {
  searchObj.data.histogram.errorMsg = err.message;
  }
@@ -1722,7 +1723,7 @@ const useLogs = () => {
  })
  .catch((err) => {
  if (err.response != undefined) {
- searchObj.data.errorMsg = err.response.data.error;
+ searchObj.data.errorMsg = err.response.data?.error;
  } else {
  searchObj.data.errorMsg = err.message;
  }
@@ -1855,7 +1856,8 @@ const useLogs = () => {
  }
 
  if (queryParams.show_histogram) {
- searchObj.meta.showHistogram = queryParams.show_histogram == "true" ? true : false;
+ searchObj.meta.showHistogram =
+ queryParams.show_histogram == "true" ? true : false;
  }
 
  searchObj.shouldIgnoreWatcher = false;

web/src/layouts/MainLayout.vue

@@ -39,8 +39,12 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
  >{{ store.state.zoConfig.custom_logo_text }}</span
  >
  <br />
- <img :src="getImageURL('images/common/spark-logo-connector.png')"
-size="sm" class="q-pt-xs q-pl-xs" style="width: 30px" />
+ <img
+ :src="getImageURL('images/common/spark-logo-connector.png')"
+ size="sm"
+ class="q-pt-xs q-pl-xs"
+ style="width: 30px"
+ />
  <img
  class="appLogo"
  :src="
@@ -77,8 +81,7 @@ size="sm" class="q-pt-xs q-pl-xs" style="width: 30px" />
  class="warning-msg"
  style="display: inline"
  >
- <q-icon name="warning"
-size="xs" class="warning" />{{
+ <q-icon name="warning" size="xs" class="warning" />{{
  store.state.organizationData.quotaThresholdMsg
  }}
  </div>
@@ -165,13 +168,10 @@ size="xs" class="warning" />{{
  </div>
 
  <div class="q-mr-xs">
- <q-btn-dropdown flat
-unelevated no-caps
-padding="xs sm">
+ <q-btn-dropdown flat unelevated no-caps padding="xs sm">
  <template #label>
  <div class="row items-center no-wrap">
- <q-avatar size="md"
-color="grey" text-color="white">
+ <q-avatar size="md" color="grey" text-color="white">
  <img
  :src="
  user.picture
@@ -735,7 +735,7 @@ export default defineComponent({
  useLocalOrganization(optiondata);
  }
 
- if (localOrg.value.identifier == data.identifier) {
+ if (localOrg.value?.identifier == data.identifier) {
  localOrgFlag = true;
  }