@tak-ps/cloudtak 12.54.0 → 12.55.0

package/src/components/CloudTAK/util/WarnChannels.vue

@@ -1,56 +0,0 @@
-<template>
-    <TablerModal>
-        <div class='modal-status bg-red' />
-        <button
-            type='button'
-            class='btn-close'
-            aria-label='Close'
-            @click='$emit("close")'
-        />
-        <div class='modal-header text-white'>
-            <div class='d-flex align-items-center'>
-                <IconInfoSquare
-                    :size='28'
-                    stroke='1'
-                />
-                <span class='mx-2'>No Channels Active</span>
-            </div>
-        </div>
-        <div class='modal-body text-white'>
-            <p>Channels are the basis of who and what you are able to see in TAK</p>
-
-            <p>At this time you do not have any active channels and as such you will not see any Users, Data Packages, or Data Syncs associated with channels.</p>
-
-            <p>It is recommended to turn on relevant channels now</p>
-
-            <div class='d-flex align-items-center'>
-                <div class='ms-auto btn-list'>
-                    <button
-                        class='btn btn-primary'
-                        @click='selectChannels'
-                    >
-                        Select Channels
-                    </button>
-                </div>
-            </div>
-        </div>
-    </TablerModal>
-</template>
-
-<script setup lang='ts'>
-import { useRouter } from 'vue-router';
-import {
-    TablerModal,
-} from '@tak-ps/vue-tabler';
-import {
-    IconInfoSquare,
-} from '@tabler/icons-vue';
-
-const router = useRouter();
-const emit = defineEmits([ 'close' ]);
-
-function selectChannels() {
-    emit('close');
-    router.push('/menu/channels');
-}
-</script>

package/src/components/CloudTAK/util/WarnConfiguration.vue

@@ -1,34 +0,0 @@
-<template>
-    <TablerModal size='lg'>
-        <div class='modal-status bg-red' />
-        <div class='modal-header text-white'>
-            <div class='d-flex align-items-center'>
-                <IconInfoSquare
-                    :size='28'
-                    stroke='1'
-                />
-                <span class='mx-2'>Welcome to CloudTAK</span>
-            </div>
-        </div>
-        <div class='modal-body text-white'>
-            <SettingsCallsign
-                mode='emit'
-                :force-callsign='true'
-                @update='emit("close")'
-            />
-        </div>
-    </TablerModal>
-</template>
-
-<script setup lang='ts'>
-import {
-    TablerModal,
-} from '@tak-ps/vue-tabler';
-import {
-    IconInfoSquare,
-} from '@tabler/icons-vue';
-
-import SettingsCallsign from './SettingsCallsign.vue';
-
-const emit = defineEmits([ 'close' ]);
-</script>

package/src/components/Configure.vue

@@ -1,259 +0,0 @@
-<template>
-    <div
-        class='page page-center'
-        style='overflow: auto;'
-    >
-        <div class='container container-normal py-4'>
-            <div class='row align-items-center g-4'>
-                <div class='col-lg'>
-                    <div class='container-tight'>
-                        <div
-                            class='text-center'
-                            style='margin-bottom: 24px;'
-                        >
-                            <img
-                                class='d-none d-md-inline'
-                                style='
-                                    height: 150px;
-                                '
-                                src='/CloudTAKLogoText.svg'
-                                alt='CloudTAK System Logo'
-                            >
-                        </div>
-                        <div class='card card-md'>
-                            <div class='card-body'>
-                                <h2 class='h2 text-center mb-4'>
-                                    Initial Server Configuration
-                                </h2>
-                                <TablerLoading v-if='loading' />
-                                <template v-else>
-                                    <div class='row g-2'>
-                                        <div class='col-12'>
-                                            <TablerInput
-                                                v-model='body.name'
-                                                :error='errors.name'
-                                                label='Server Name'
-                                                placeholder='TAK Server Name'
-                                                description='Human Readable name for the server'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-                                        <div class='col-12'>
-                                            <TablerInput
-                                                v-model='helper.hostname'
-                                                label='Server Hostname'
-                                                placeholder='ops.example.com'
-                                                description='Hostname or IP address of the TAK Server'
-                                                :error='errors.hostname'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-                                        <div class='col-md-4 col-12'>
-                                            <TablerInput
-                                                v-model='helper.stream'
-                                                type='number'
-                                                label='CoT Port'
-                                                placeholder='8089'
-                                                description='Streaming COT API - Usually on port 8089'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-                                        <div class='col-md-4 col-12'>
-                                            <TablerInput
-                                                v-model='helper.api'
-                                                type='number'
-                                                label='Marti Port'
-                                                placeholder='8443'
-                                                description='Marti API - Usually on port 8443'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-                                        <div class='col-md-4 col-12'>
-                                            <TablerInput
-                                                v-model='helper.webtak'
-                                                type='number'
-                                                label='WebTAK'
-                                                placeholder='8446'
-                                                description='WebTAK API - Usually on port 8446'
-                                                :error='errors.url'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-
-                                        <div class='mb-2'>
-                                            <label class='mx-2'>Admin Certificate</label>
-                                            <CertificateP12
-                                                v-if='!body.auth || !body.auth.cert || !body.auth.key'
-                                                @certs='body.auth = $event'
-                                            />
-
-                                            <template v-else>
-                                                <div class='col-12 d-flex align-items-center'>
-                                                    <IconCheck
-                                                        :size='40'
-                                                        class='text-green'
-                                                    />
-                                                    <span class='mx-3'>Certificate Uploaded</span>
-
-                                                    <div class='ms-auto'>
-                                                        <IconTrash
-                                                            v-tooltip='"Remove Certificate"'
-                                                            :size='32'
-                                                            stroke='1'
-                                                            class='cursor-pointer'
-                                                            @click='body.auth = { cert: "", key: "" };'
-                                                        />
-                                                    </div>
-                                                </div>
-                                            </template>
-                                        </div>
-                                        <div class='mb-2'>
-                                            <TablerInput
-                                                v-model='body.username'
-                                                label='Initial Administrator Username'
-                                                description='An existing TAK user to use as an initial CloudTAK System Administrator - The TAK Server must respond with a cert for this username/password combo'
-                                                autocomplete='username'
-                                                :error='errors.username'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-                                        <div class='mb-2'>
-                                            <TablerInput
-                                                v-model='body.password'
-                                                type='password'
-                                                label='Initial Administrator Password'
-                                                description='An existing TAK user to use as an initial CloudTAK System Administrator - The TAK Server must respond with a cert for this username/password combo'
-                                                autocomplete='password'
-                                                :error='errors.password'
-                                                @keyup.enter='updateServer'
-                                            />
-                                        </div>
-                                        <div class='form-footer'>
-                                            <button
-                                                type='submit'
-                                                class='btn btn-primary w-100'
-                                                :disabled='!body.auth || !body.auth.key'
-                                                @click='updateServer'
-                                            >
-                                                Configure Server
-                                            </button>
-                                        </div>
-                                    </div>
-                                </template>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref, onMounted } from 'vue';
-import { useRouter } from 'vue-router';
-import { std } from '../std.ts';
-import type { Server, Server_Update } from '../types.ts';
-import CertificateP12 from './ETL/Connection/CertificateP12.vue';
-import {
-    TablerLoading,
-    TablerInput
-} from '@tak-ps/vue-tabler'
-import {
-    IconCheck,
-    IconTrash
-} from '@tabler/icons-vue';
-
-const router = useRouter();
-
-const loading = ref(false);
-
-const errors = ref<Record<string, string>>({
-    name: '',
-    username: '',
-    password: '',
-    hostname: ''
-})
-
-const helper = ref({
-    hostname: '',
-    stream: 8089,
-    webtak: 8446,
-    api: 8443,
-});
-
-const body = ref<Server_Update>({
-    name: '',
-    url: '',
-    api: '',
-    webtak: '',
-    username: '',
-    password: '',
-    auth: {
-        key: '',
-        cert: ''
-    }
-})
-
-onMounted(async () => {
-    let server;
-    try {
-        server = await std('/api/server') as Server;
-    } catch (err) {
-        console.error(err);
-    }
-
-    if (!server || server.status === 'configured') {
-        delete localStorage.token;
-        window.location.href = '/login';
-    }
-});
-
-async function updateServer() {
-    if (!body.value.name || body.value.name.trim().length < 8) {
-        errors.value.name = 'Name should be > 8 characters';
-    } else {
-        errors.value.name = '';
-    }
-
-    if (!body.value.username || body.value.username.trim().length === 0) {
-        errors.value.username = 'Username cannot be empty';
-    } else {
-        errors.value.username = '';
-    }
-
-    if (!body.value.password || body.value.password.trim().length === 0) {
-        errors.value.password = 'Password cannot be empty';
-    } else {
-        errors.value.password = '';
-    }
-
-    if (!helper.value.hostname || helper.value.hostname.trim().length === 0) {
-        errors.value.hostname = 'Hostname cannot be empty';
-    } else {
-        errors.value.hostname = '';
-    }
-
-    for (const e in errors.value) {
-        if (errors.value[e]) return;
-    }
-
-    body.value.url = `ssl://${helper.value.hostname}:${helper.value.stream}`;
-    body.value.api = `https://${helper.value.hostname}:${helper.value.api}`;
-    body.value.webtak = `https://${helper.value.hostname}:${helper.value.webtak}`;
-
-    loading.value = true;
-
-    try {
-        await std('/api/server', {
-            method: 'PATCH',
-            body: body.value
-        })
-
-        router.push('/login');
-    } catch (err) {
-        loading.value = false;
-        throw err;
-    }
-}
-</script>

package/src/components/ETL/Connection/AgencyBadge.vue

@@ -1,102 +0,0 @@
-<template>
-    <div>
-        <span
-            v-if='connection.agency'
-            class='badge border text-white cursor-pointer'
-            :class='{
-                "bg-blue": !muted,
-                "bg-blue-lt": muted
-            }'
-            style='height: 20px'
-            @click='info.shown = true'
-            v-text='`Agency`'
-        />
-        <span
-            v-else
-            class='badge border text-white'
-            :class='{
-                "bg-red": !muted,
-                "bg-red-lt": muted
-            }'
-            style='height: 20px'
-            v-text='`Admin`'
-        />
-
-        <TablerModal v-if='info.shown'>
-            <div class='modal-status bg-yellow' />
-            <button
-                type='button'
-                class='btn-close'
-                aria-label='Close'
-                @click='info.shown = false'
-            />
-
-            <TablerLoading
-                v-if='!agency'
-                desc='Loading Agency...'
-            />
-            <template v-else>
-                <div class='modal-header'>
-                    <div
-                        class='modal-title'
-                        v-text='agency.name'
-                    />
-                </div>
-
-                <div class='modal-body'>
-                    <div class='datagrid'>
-                        <div class='datagrid-item'>
-                            <div class='datagrid-title'>
-                                Description
-                            </div>
-                            <div
-                                class='datagrid-content'
-                                v-text='"No Description"'
-                            />
-                        </div>
-                    </div>
-                </div>
-            </template>
-            <div class='modal-footer'>
-                <button
-                    class='btn btn-primary'
-                    @click='info.shown = false'
-                >
-                    Close
-                </button>
-            </div>
-        </TablerModal>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref, watch, onMounted } from 'vue';
-import {
-    TablerModal,
-    TablerLoading
-} from '@tak-ps/vue-tabler';
-import type { ETLConnection, ETLAgency } from '../../../types.ts';
-import { std } from '../../../std.ts';
-
-const props = defineProps<{
-    connection: ETLConnection,
-    muted?: boolean
-}>()
-
-const info = ref({ shown: false });
-const agency = ref<ETLAgency | undefined>();
-
-watch(info, async () => {
-    await fetch()
-});
-
-onMounted(async () => {
-    if (props.connection.agency) {
-        await fetch()
-    }
-});
-
-async function fetch() {
-    agency.value = await std(`/api/agency/${props.connection.agency}`) as ETLAgency;
-}
-</script>

package/src/components/ETL/Connection/AgencySelect.vue

@@ -1,185 +0,0 @@
-<template>
-    <div>
-        <div class='d-flex align-items-center'>
-            <label class='mx-1 mb-1'>Connection Agency</label>
-            <div
-                v-if='isSystemAdmin'
-                class='ms-auto'
-            >
-                <TablerToggle
-                    v-model='noAgency'
-                    label='System Admin Connection - No Owning Agency'
-                />
-            </div>
-        </div>
-        <div class='card'>
-            <template v-if='noAgency'>
-                <TablerNone
-                    :create='false'
-                    :compact='true'
-                    label='Agency - System Admin Access Only'
-                />
-            </template>
-            <template v-else>
-                <div class='card-body'>
-                    <TablerLoading
-                        v-if='loading.main'
-                        :inline='true'
-                        desc='Loading Agencies'
-                    />
-                    <template v-else-if='selected'>
-                        <div class='col-12 d-flex align-items-center'>
-                            <div v-text='selected.name' />
-                            <div class='ms-auto'>
-                                <TablerIconButton
-                                    v-if='selected && list.total > 1'
-                                    title='Remove Agency'
-                                    @click='selected = undefined'
-                                >
-                                    <IconTrash
-                                        :size='32'
-                                        stroke='1'
-                                    />
-                                </TablerIconButton>
-                            </div>
-                        </div>
-                    </template>
-                    <template v-else>
-                        <div class='col-12 pb-2'>
-                            <TablerInput
-                                v-model='filter'
-                                icon='search'
-                                placeholder='Agency Filter...'
-                            />
-                        </div>
-
-                        <TablerLoading
-                            v-if='loading.list'
-                            desc='Loading Agencies'
-                        />
-                        <TablerNone
-                            v-else-if='list.total === 0'
-                            :create='false'
-                            :compact='true'
-                            label='Agencies'
-                        />
-                        <template v-else>
-                            <div
-                                v-for='agency in list.items'
-                                :key='agency.id'
-                                class='hover px-2 py-2 cursor-pointer row rounded col-12'
-                                @click='selected = agency'
-                            >
-                                <div class='d-flex align-items-center'>
-                                    <IconHome
-                                        :size='32'
-                                        stroke='1'
-                                    />
-                                    <span
-                                        class='mx-2'
-                                        v-text='agency.name'
-                                    />
-                                </div>
-                            </div>
-                        </template>
-                    </template>
-                </div>
-            </template>
-        </div>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref, watch, onMounted } from 'vue';
-import { std, stdurl } from '../../../std.ts';
-import type { Profile, ETLAgencyList, ETLAgency } from '../../../types.ts';
-import { watchDebounced } from '@vueuse/core'
-import {
-    IconTrash,
-    IconHome,
-} from '@tabler/icons-vue';
-import {
-    TablerIconButton,
-    TablerLoading,
-    TablerToggle,
-    TablerInput,
-    TablerNone,
-} from '@tak-ps/vue-tabler';
-
-const props = defineProps<{
-    modelValue: number | null,
-}>()
-
-const emit = defineEmits([ 'update:modelValue', 'disabled' ]);
-
-const noAgency = ref(props.modelValue === null);
-const loading = ref({
-    main: true,
-    list: true,
-});
-const filter = ref('');
-const selected = ref<ETLAgency | undefined>(undefined);
-const isSystemAdmin = ref(false);
-
-const list =  ref<ETLAgencyList>({
-    total: 0,
-    config: {
-        enabled: true
-    },
-    items: []
-});
-
-watch(selected, () => {
-    if (!noAgency.value) {
-        emit('update:modelValue', selected.value ? selected.value.id : undefined);
-    }
-});
-
-watch(noAgency, () => {
-    if (noAgency.value) {
-        selected.value = undefined;
-        emit('update:modelValue', null);
-    }
-});
-
-watchDebounced(filter, async function() {
-    await listData()
-}, { debounce: 500 })
-
-watch(props, async (newProps, oldProps) => {
-    if (newProps.modelValue !== oldProps.modelValue) {
-        await fetch();
-    }
-})
-
-onMounted(async () => {
-    const profile = await std('/api/profile') as Profile;
-    isSystemAdmin.value = profile.system_admin;
-
-    if (props.modelValue) await fetch();
-    await listData();
-    loading.value.main = false;
-});
-
-async function fetch() {
-    selected.value = await std(`/api/agency/${props.modelValue}`) as ETLAgency;
-}
-
-async function listData() {
-    loading.value.list = true;
-    const url = stdurl('/api/agency');
-    url.searchParams.append('filter', filter.value);
-    const data = await std(url) as ETLAgencyList;
-
-    if (!isSystemAdmin.value && data.total === 1) {
-        selected.value = data.items[0];
-    }
-
-    if (!data.config.enabled) {
-        emit('disabled', true);
-    } else {
-        list.value = data;
-        loading.value.list = false;
-    }
-}
-</script>