-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
diff --git a/resources/js/Pages/Profile/Partials/LogoutOtherBrowserSessionsForm.vue b/resources/js/Pages/Profile/Partials/LogoutOtherBrowserSessionsForm.vue
index 1db2f7aaf..243501d9d 100644
--- a/resources/js/Pages/Profile/Partials/LogoutOtherBrowserSessionsForm.vue
+++ b/resources/js/Pages/Profile/Partials/LogoutOtherBrowserSessionsForm.vue
@@ -8,6 +8,11 @@ import InputError from '@/Components/InputError.vue';
import PrimaryButton from '@/Components/PrimaryButton.vue';
import SecondaryButton from '@/Components/SecondaryButton.vue';
import TextInput from '@/Components/TextInput.vue';
+import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
+import {
+ faDesktop
+} from '@fortawesome/free-solid-svg-icons'
+
defineProps({
sessions: Array,
@@ -53,33 +58,31 @@ const closeModal = () => {
-
+
+
+
- If necessary, you may log out of all of your other browser sessions across all of your devices. Some of your recent sessions are listed below; however, this list may not be exhaustive. If you feel your account has been compromised, you should also update your password.
-
+ + If necessary, you may log out of all of your other browser sessions across all of your devices. + Some of your recent sessions are listed below; however, this list may not be exhaustive. +
++ If you feel your account has been compromised, you should also update your password. +
-
-
+
+
-
-
-
+
-
+
{{ session.agent.platform ? session.agent.platform : 'Unknown' }} - {{ session.agent.browser ? session.agent.browser : 'Unknown' }}
-
+
diff --git a/resources/js/Pages/Profile/Partials/UpdatePasswordForm.vue b/resources/js/Pages/Profile/Partials/UpdatePasswordForm.vue
index e47c357ca..f96daccbd 100644
--- a/resources/js/Pages/Profile/Partials/UpdatePasswordForm.vue
+++ b/resources/js/Pages/Profile/Partials/UpdatePasswordForm.vue
@@ -3,10 +3,7 @@ import { ref } from 'vue';
import { useForm } from '@inertiajs/vue3';
import ActionMessage from '@/Components/ActionMessage.vue';
import FormSection from '@/Components/FormSection.vue';
-import InputError from '@/Components/InputError.vue';
-import InputLabel from '@/Components/InputLabel.vue';
import PrimaryButton from '@/Components/PrimaryButton.vue';
-import TextInput from '@/Components/TextInput.vue';
const passwordInput = ref(null);
const currentPasswordInput = ref(null);
@@ -48,43 +45,42 @@ const updatePassword = () => {
-
{{ session.ip_address }},
- This device
+ This device
Last active {{ session.last_active }}
-
+
+
+
+
+
-
-
+
+
+
+
+
-
-
+
+
+
+
+
diff --git a/resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.vue b/resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.vue
index dcd7cd5b4..c425e5d0b 100644
--- a/resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.vue
+++ b/resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.vue
@@ -86,85 +86,23 @@ const clearPhotoFileInput = () => {
-
-
-
-
-
-
- Select A New Photo
-
-
-
- Remove Photo
-
-
-
+
-
- ![]()
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+ - Your email address is unverified. - - - Click here to re-send the verification email. - -
- -
- A new verification link has been sent to your email address.
-
-
+
+
+
+
diff --git a/resources/js/Pages/Profile/Show.vue b/resources/js/Pages/Profile/Show.vue
index be8789854..c3b724889 100644
--- a/resources/js/Pages/Profile/Show.vue
+++ b/resources/js/Pages/Profile/Show.vue
@@ -15,43 +15,35 @@ defineProps({
- Profile -
- +
+
+
diff --git a/resources/js/Pages/Query/codemirror6-bootstrap-theme.ts b/resources/js/Pages/Query/codemirror6-bootstrap-theme.ts
new file mode 100644
index 000000000..72e9dad56
--- /dev/null
+++ b/resources/js/Pages/Query/codemirror6-bootstrap-theme.ts
@@ -0,0 +1,319 @@
+/**
+ * From https://github.com/logue/codemirror6-bootstrap-theme
+ * npm package does not work, so code duplicated here.
+ */
+
+import { EditorView } from '@codemirror/view';
+import type { Extension } from '@codemirror/state';
+import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
+import { tags as t } from '@lezer/highlight';
+
+import { toJSON } from 'css-convert-json';
+import bootstrap from 'bootstrap/dist/css/bootstrap.css?raw';
+
+/** Bootstrap theme */
+const style = toJSON(bootstrap).children;
+
+/** Root theme */
+const root = style[':root'].attributes;
+// console.log(root);
+
+// Generic Bootstrap Colors
+const blue = root['--bs-blue']; // Equals to primary
+const indigo = root['--bs-indigo'];
+const purple = root['--bs-purple'];
+const pink = root['--bs-pink'];
+const red = root['--bs-red']; // Equals to danger
+const orange = root['--bs-orange'];
+const yellow = root['--bs-yellow']; // Equals to warning
+const green = root['--bs-green']; // Equals to success
+const teal = root['--bs-teal'];
+const cyan = root['--bs-cyan']; // Equals to info
+const dark = root['--bs-dark'];
+const light = root['--bs-light'];
+const white = root['--bs-white'];
+const black = root['--bs-black'];
+const gray = [
+ '--bs-white',
+ '--bs-gray-100', // Equals to light
+ '--bs-gray-200', // assume original light1
+ '--bs-gray-300',
+ '--bs-gray-400',
+ '--bs-gray-500',
+ '--bs-gray-600', // Equals to secondary
+ '--bs-gray-700',
+ '--bs-gray-800', // assume original light1
+ '--bs-gray-900', // Equals to dark
+];
+
+/** Bootsrap Form Style */
+const form = style['.form-control'].attributes;
+/** Bootstrap Form Focused style */
+const formFocused = style['.form-control:focus'].attributes;
+delete formFocused.color;
+delete formFocused['background-color'];
+
+/** Editor */
+const editor = form;
+delete editor.padding;
+delete editor.color;
+delete editor['background-color'];
+
+/** Input */
+const input = form;
+delete input.width;
+delete editor.color;
+delete editor['background-color'];
+input.display = 'inline';
+
+/** Bootstrap Theme */
+export const bootstrapTheme: Extension = EditorView.theme(
+ {
+ '&.cm-editor': {
+ ...form,
+ '&.cm-focused': {
+ ...formFocused,
+ },
+ },
+ '.cm-scroller': {
+ fontFamily: root['--bs-font-monospace'],
+ lineHeight: root['--bs-body-line-height'],
+ },
+ '.cm-content': { caretColor: black },
+ '.cm-selectionBackground': {
+ background: gray[4],
+ },
+ '.cm-focused .cm-selectionBackground': {
+ background: dark,
+ },
+ '.cm-cursor, .cm-dropCursor': {
+ borderLeft: `1.2px solid ${gray[8]}`,
+ },
+ '.cm-activeLine': {
+ color: black,
+ backgroundColor: light,
+ },
+ '.cm-specialChar': {
+ color: red,
+ },
+ '.cm-gutters': {
+ color: gray[6],
+ backgroundColor: gray[3],
+ borderRight: `1px solid ${gray[3]}`,
+ borderTopLeftRadius: root['--bs-border-radius'],
+ borderBottomLeftRadius: root['--bs-border-radius'],
+ },
+ '.cm-activeLineGutter': {
+ backgroundColor: gray[4],
+ },
+ '.cm-panels': {
+ backgroundColor: gray[3],
+ color: black,
+ },
+ '.cm-panels-top': {
+ borderBottom: `1px solid ${gray[4]}`,
+ },
+ '.cm-panels-bottom': {
+ borderTop: `1px solid ${gray[4]}`,
+ },
+ '.cm-placeholder': {
+ color: gray[6],
+ },
+ '.cm-button': {
+ ...style['.btn'].attributes,
+ ...style['.btn-sm, .btn-group-sm > .btn'].attributes,
+ ...style['.btn-outline-secondary'].attributes,
+ backgroundImage: 'none',
+ '&:hover': {
+ ...style['.btn:hover'].attributes,
+ },
+ // '&:active': {
+ // backgroundImage: 'none',
+ // ...style[
+ // '.btn-check:checked + .btn, .btn-check:active + .btn, .btn:active, .btn.active, .btn.show'
+ // ].attributes,
+ // },
+ },
+ '.cm-textfield': {
+ ...input,
+ ...style['.form-control-sm'].attributes,
+ '&:focus': {
+ ...formFocused,
+ },
+ },
+ // '.cm-panel.cm-search input[type=checkbox]': {
+ // ...style['.form-check-input'].attributes,
+ // ...style['.form-check-input[type=checkbox]'].attributes,
+ // '&:active': {
+ // ...style['.form-check-input:active'].attributes,
+ // },
+ // '&:checked': {
+ // ...style['.form-check-input:checked'].attributes,
+ // ...style['.form-check-input:checked[type=checkbox]'].attributes,
+ // },
+ // '&:focus': {
+ // ...style['.form-check-input:focus'].attributes,
+ // },
+ // },
+ '.cm-panels-top .cm-panel': {
+ borderTopLeftRadius: root['--bs-border-radius'],
+ borderTopRightRadius: root['--bs-border-radius'],
+ },
+ '.cm-panels-bottom .cm-panel': {
+ borderBottomLeftRadius: root['--bs-border-radius'],
+ borderBottomRightRadius: root['--bs-border-radius'],
+ },
+ },
+ { dark: false }
+);
+
+/** Bootstrap Theme Dark mode */
+export const bootstrapThemeDark: Extension = EditorView.theme(
+ {
+ '&.cm-editor': {
+ ...form,
+ '&.cm-focused': {
+ ...formFocused,
+ },
+ },
+ '.cm-scroller': {
+ fontFamily: root['--bs-font-monospace'],
+ lineHeight: root['--bs-body-line-height'],
+ },
+ '.cm-content': { caretColor: white },
+ '.cm-selectionBackground': {
+ background: dark,
+ },
+ '.cm-focused .cm-selectionBackground': {
+ background: root['--bs-light'],
+ },
+ '.cm-cursor, .cm-dropCursor': {
+ borderLeft: `1.2px solid ${gray[8]}`,
+ },
+ '.cm-cursor': {
+ borderLeftColor: gray[7],
+ },
+ '.cm-activeLine': {
+ color: white,
+ backgroundColor: gray[6],
+ },
+ '.cm-specialChar': { color: red },
+ '.cm-gutters': {
+ backgroundColor: gray[7],
+ color: gray[4],
+ borderTopLeftRadius: root['--bs-border-radius'],
+ borderBottomLeftRadius: root['--bs-border-radius'],
+ },
+ '.cm-activeLineGutter': {
+ backgroundColor: dark,
+ },
+ '.cm-panels': {
+ backgroundColor: gray[8],
+ color: white,
+ },
+ '.cm-placeholder': {
+ color: gray[6],
+ },
+ '.cm-button': {
+ ...style['.btn'].attributes,
+ ...style['.btn-sm, .btn-group-sm > .btn'].attributes,
+ ...style['.btn-secondary'].attributes,
+ backgroundImage: 'none',
+ '&:hover': {
+ ...style['.btn:hover'].attributes,
+ },
+ // '&:active': {
+ // backgroundImage: 'none',
+ // ...style[
+ // '.btn-check:checked + .btn, .btn-check:active + .btn, .btn:active, .btn.active, .btn.show'
+ // ].attributes,
+ // },
+ },
+ '.cm-textfield': {
+ ...input,
+ ...style['.form-control-sm'].attributes,
+ '&:focus': {
+ ...formFocused,
+ },
+ },
+ // '.cm-panel.cm-search input[type=checkbox]': {
+ // ...style['.form-check-input'].attributes,
+ // ...style['.form-check-input[type=checkbox]'].attributes,
+ // '&:active': {
+ // ...style['.form-check-input:active'].attributes,
+ // },
+ // '&:checked': {
+ // ...style['.form-check-input:checked'].attributes,
+ // ...style['.form-check-input:checked[type=checkbox]'].attributes,
+ // },
+ // '&:focus': {
+ // ...style['.form-check-input:focus'].attributes,
+ // },
+ // },
+ '.cm-panels-top .cm-panel': {
+ borderTopLeftRadius: root['--bs-border-radius'],
+ borderTopRightRadius: root['--bs-border-radius'],
+ },
+ '.cm-panels-bottom .cm-panel': {
+ borderBottomLeftRadius: root['--bs-border-radius'],
+ borderBottomRightRadius: root['--bs-border-radius'],
+ },
+ },
+ { dark: true }
+);
+
+/** Bootstrap Hilighting Text Style */
+export const bootstrapHighlightStyle = HighlightStyle.define([
+ { tag: t.keyword, color: purple },
+ {
+ tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
+ color: pink,
+ },
+ { tag: [t.function(t.variableName), t.labelName], color: blue },
+ { tag: [t.color, t.constant(t.name), t.standard(t.name)], color: orange },
+ { tag: [t.definition(t.name), t.separator], color: indigo },
+ {
+ tag: [
+ t.typeName,
+ t.className,
+ t.number,
+ t.changed,
+ t.annotation,
+ t.modifier,
+ t.self,
+ t.namespace,
+ ],
+ color: yellow,
+ },
+ {
+ tag: [
+ t.operator,
+ t.operatorKeyword,
+ t.url,
+ t.escape,
+ t.regexp,
+ t.link,
+ t.special(t.string),
+ ],
+ color: cyan,
+ },
+ { tag: [t.meta, t.comment], color: green },
+ { tag: t.strong, fontWeight: 'bold' },
+ { tag: t.emphasis, fontStyle: 'italic' },
+ { tag: t.strikethrough, textDecoration: 'line-through' },
+ { tag: t.link, color: green, textDecoration: 'underline' },
+ { tag: t.heading, fontWeight: 'bold', color: pink },
+ { tag: [t.atom, t.bool, t.special(t.variableName)], color: orange },
+ { tag: [t.processingInstruction, t.string, t.inserted], color: teal },
+ { tag: t.invalid, color: red },
+]);
+
+export const Bootstrap: Extension = [
+ bootstrapTheme,
+ syntaxHighlighting(bootstrapHighlightStyle),
+];
+
+export const BootstrapDark: Extension = [
+ bootstrapThemeDark,
+ syntaxHighlighting(bootstrapHighlightStyle),
+];
diff --git a/resources/views/inertia.blade.php b/resources/views/inertia.blade.php
new file mode 100644
index 000000000..81341a06e
--- /dev/null
+++ b/resources/views/inertia.blade.php
@@ -0,0 +1 @@
+@extends('layouts.inertia')
diff --git a/resources/views/layouts/inertia.blade.php b/resources/views/layouts/inertia.blade.php
index 7a2deeb63..374c52594 100644
--- a/resources/views/layouts/inertia.blade.php
+++ b/resources/views/layouts/inertia.blade.php
@@ -15,7 +15,7 @@
- {{ config('app.name', 'MunkiReport') }}
+ {{ config('app.name', 'MunkiReport') }}
@@ -58,9 +58,9 @@
@endif
- @vite('resources/js/app.ts')
- @inertiaHead
@routes
+ @vite(['resources/js/app.ts', "resources/js/Pages/{$page['component']}.vue"])
+ @inertiaHead
@inertia
diff --git a/resources/views/layouts/mr.blade.php b/resources/views/layouts/mr.blade.php
index ccc240899..b0ac63444 100644
--- a/resources/views/layouts/mr.blade.php
+++ b/resources/views/layouts/mr.blade.php
@@ -215,7 +215,7 @@
+
diff --git a/resources/js/Pages/Query/Editor.vue b/resources/js/Pages/Query/Editor.vue
index 5385373b6..831fab17c 100644
--- a/resources/js/Pages/Query/Editor.vue
+++ b/resources/js/Pages/Query/Editor.vue
@@ -1,29 +1,56 @@
-
-
+
+
-
+
-
-
+
+
+
+
+
+
-
-
-
-
+
-
+
diff --git a/resources/js/Pages/Query/Index.vue b/resources/js/Pages/Query/Index.vue
index b3f4943b6..d18e1cec0 100644
--- a/resources/js/Pages/Query/Index.vue
+++ b/resources/js/Pages/Query/Index.vue
@@ -4,35 +4,12 @@ import AppLayout from '@/Layouts/AppLayout.vue';
import {gql, useQuery} from '@urql/vue';
import Editor from "./Editor.vue";
-let first = ref(10);
-let pageNumber = ref(1);
-const result = useQuery({
- query: gql`
- query($first: Int!, $page: Int) {
- reportData(first: $first, page: $page) {
- data {
- serial_number
- console_user
- long_username
- }
- paginatorInfo {
- total
- }
- }
- }
- `,
- variables: { first, page: pageNumber }
-})
-const fetching = computed(() => result.fetching);
- Fetching...{{fetching}}
+ {{error}}
+
-
- Loading...
-