Allow defining icon

- Adds warning class
This commit is contained in:
Kakarot
2024-02-17 06:13:47 -06:00
parent 40df11027b
commit 5c60c94197
7 changed files with 119 additions and 109 deletions
+44 -47
View File
@@ -1,65 +1,62 @@
import { registerWindowMethods } from "./testing.js";
import { isEnvBrowser } from "./utils.js";
import {
determineStyleFromVariant,
DEV_MODE,
fetchNotifyConfig,
NOTIFY_CONFIG,
} from "./config.js";
import { determineStyleFromVariant, DEV_MODE, fetchNotifyConfig, NOTIFY_CONFIG } from "./config.js";
const { useQuasar } = Quasar;
const { onMounted, onUnmounted } = Vue;
const app = Vue.createApp({
setup() {
const $q = useQuasar();
setup() {
const $q = useQuasar();
const showNotif = async ({ data }) => {
// Otherwise we process any old MessageEvent with a data property
if (data?.action !== "notify") return;
const showNotif = async ({ data }) => {
// Otherwise we process any old MessageEvent with a data property
if (data?.action !== "notify") return;
const { text, length, type, caption } = data;
const { classes, icon } = determineStyleFromVariant(type);
const { text, length, type, caption, icon: dataIcon } = data;
let { classes, icon } = determineStyleFromVariant(type);
// Make sure we have sucessfully fetched out config properly
if (!NOTIFY_CONFIG) {
console.error(
"The notification config did not load properly, trying again for next time"
);
// Lets check again to see if it exists
await fetchNotifyConfig();
// If we have a config lets re-run notification with same data, this
// isn't recursive though.
if (NOTIFY_CONFIG) return showNotif({ data });
}
if (dataIcon) {
icon = dataIcon;
}
$q.notify({
message: text,
multiLine: text.length > 100,
// If our text is larger than a 100 characters,
// we should use multiline notifications
group: NOTIFY_CONFIG.NotificationStyling.group ?? false,
progress: NOTIFY_CONFIG.NotificationStyling.progress ?? true,
position: NOTIFY_CONFIG.NotificationStyling.position ?? "right",
timeout: length,
caption,
classes,
icon,
});
};
onMounted(() => {
window.addEventListener("message", showNotif);
});
onUnmounted(() => {
window.removeEventListener("message", showNotif);
});
return {};
},
// Make sure we have sucessfully fetched out config properly
if (!NOTIFY_CONFIG) {
console.error("The notification config did not load properly, trying again for next time");
// Lets check again to see if it exists
await fetchNotifyConfig();
// If we have a config lets re-run notification with same data, this
// isn't recursive though.
if (NOTIFY_CONFIG) return showNotif({ data });
}
$q.notify({
message: text,
multiLine: text.length > 100,
// If our text is larger than a 100 characters,
// we should use multiline notifications
group: NOTIFY_CONFIG.NotificationStyling.group ?? false,
progress: NOTIFY_CONFIG.NotificationStyling.progress ?? true,
position: NOTIFY_CONFIG.NotificationStyling.position ?? "right",
timeout: length,
caption,
classes,
icon,
});
};
onMounted(() => {
window.addEventListener("message", showNotif);
});
onUnmounted(() => {
window.removeEventListener("message", showNotif);
});
return {};
},
});
app.use(Quasar, { config: {} });
app.mount("#q-app");
if (DEV_MODE || isEnvBrowser()) {
registerWindowMethods();
registerWindowMethods();
}