@3cr/viewer-browser 0.0.248 → 0.0.293

package/src/components/demo/patient/DemoPatientSendToPartyModal.vue

@@ -1,177 +0,0 @@
-<script setup lang="ts">
-import { computed, ref } from "vue";
-import {openUrl, PRICING_URL} from "@/components/demo/options";
-
-export interface Props {
-  modal: boolean;
-}
-
-const emit = defineEmits<{
-  "update:modal": [value: boolean];
-}>();
-
-const props = withDefaults(defineProps<Props>(), {
-  modal: false,
-});
-
-const step2 = ref<boolean>(false);
-const user = ref<string>("");
-const users = ref<Array<string>>([]);
-const modalState = computed({
-  get() {
-    return props.modal;
-  },
-  set(value) {
-    emit("update:modal", value);
-  },
-});
-
-function add() {
-  if (user.value && !users.value.includes(user.value) && isValid()) {
-    users.value.push(user.value);
-  }
-}
-
-function isValid() {
-  return /^(([^<>()[\]\\.,;:\s@']+(\.[^<>()\\[\]\\.,;:\s@']+)*)|('.+'))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
-    user.value
-  );
-}
-</script>
-
-<template>
-  <v-dialog v-model:model-value="modalState">
-    <v-card
-      class="pa-1 ma-auto position-relative motif-background card-bg-border"
-      theme="dark"
-      max-width="680"
-      min-width="450"
-    >
-      <v-card-title class="text-center mb-4 mt-2 font-weight-bold">
-        Send Scan to a 3rd Party
-      </v-card-title>
-      <v-card-text>
-        <v-text-field
-          class="text-justify"
-          id="share-email-field-item"
-          ref="shareEmail"
-          v-model="user"
-          label="Send to Email"
-          variant="outlined"
-          density="compact"
-          :rules="[
-            (v) =>
-              /^(([^<>()[\]\\.,;:\s@']+(\.[^<>()\\[\]\\.,;:\s@']+)*)|('.+'))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
-                v
-              ) || `Email must be valid`,
-          ]"
-          clearable
-          @keyup.enter="add"
-        >
-          <template #append-inner>
-            <v-btn
-              v-show="isValid()"
-              id="check-mark"
-              icon
-              class="check-background mt-n01 bg-transparent"
-              size="sm"
-              small
-              elevation="0"
-              :ripple="false"
-              ><v-icon color="success">check</v-icon></v-btn
-            >
-          </template>
-          <template #append>
-            <v-tooltip top>
-              <template #activator="{ props }">
-                <v-btn
-                  v-bind="props"
-                  icon
-                  class="mt-n1 bg-transparent"
-                  elevation="0"
-                  @click="add"
-                  ><v-icon color="success">add</v-icon></v-btn
-                >
-              </template>
-              Include as Pending below
-            </v-tooltip>
-          </template>
-        </v-text-field>
-      </v-card-text>
-      <v-card-text v-if="users.length > 0">
-        Pending 3rd Parties
-        <v-alert
-          v-for="userItem in users"
-          class="my-1"
-          style="font-size: 60%"
-          close-label="Close Alert"
-          color="orange-accent-4"
-          density="compact"
-          :title="userItem"
-          variant="tonal"
-          @click:close="users.splice(users.indexOf(userItem), 1)"
-          closable
-        >
-          New User
-        </v-alert>
-      </v-card-text>
-      <v-card-actions>
-        <v-btn data-testid="close" color="red" @click="modalState = false">
-          Continue with Demo
-        </v-btn>
-        <v-spacer />
-        <v-btn
-          data-testid="confirm"
-          variant="flat"
-          color="success"
-          @click="
-            step2 = true;
-            modalState = false;
-          "
-          :disabled="users.length === 0"
-        >
-          Send to 3rd Parties
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-  <v-dialog v-model:model-value="step2">
-    <v-card
-      class="pa-1 ma-auto position-relative motif-background card-bg-border"
-      theme="dark"
-      max-width="680"
-    >
-      <v-card-title class="text-center mb-4 mt-2 font-weight-bold">
-        Scan shared
-      </v-card-title>
-      <v-card-text class="text-justify">
-        Congratulations, you have sent your scan to a 3rd party.
-      </v-card-text>
-      <v-card-text class="text-justify">
-        Note: This is just a demonstration of how you can in the online viewer,
-        so we have not sent it to the users specified.
-      </v-card-text>
-      <v-card-text class="text-justify">
-        If you would like to view your own scan and/or send it to another party,
-        please select below
-      </v-card-text>
-      <v-card-actions>
-        <v-btn color="red" @click="step2 = false"> Continue with Demo </v-btn>
-        <v-spacer />
-        <v-btn
-          variant="flat"
-          color="success"
-          @click="openUrl(PRICING_URL)"
-        >
-          I want to view my own scan
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-</template>
-
-<style scoped>
-.v-alert-title {
-  font-size: 80%;
-}
-</style>

package/src/components/demo/patient/DemoPatientShareToMobileModal.vue

@@ -1,102 +0,0 @@
-<script setup lang="ts">
-import { computed, ref } from "vue";
-import {openUrl, PRICING_URL} from "@/components/demo/options";
-
-export interface Props {
-  modal: boolean;
-}
-
-const emit = defineEmits<{
-  "update:modal": [value: boolean];
-}>();
-
-const props = withDefaults(defineProps<Props>(), {
-  modal: false,
-});
-
-const step2 = ref<boolean>(false);
-const modalState = computed({
-  get() {
-    return props.modal;
-  },
-  set(value) {
-    emit("update:modal", value);
-  },
-});
-</script>
-
-<template>
-  <v-dialog v-model:model-value="modalState">
-    <v-card
-      class="pa-1 ma-auto position-relative motif-background card-bg-border"
-      theme="dark"
-      max-width="680"
-    >
-      <v-card-title class="text-center mb-4 mt-2 font-weight-bold">
-        Download 3Dicom Mobile
-      </v-card-title>
-      <v-card-text class="text-justify">
-        <img
-          src="../../../assets/images/apple-qr.svg"
-          alt="logo-home"
-          width="47%"
-          class="mr-auto rounded-lg"
-        />
-        <img
-          src="../../../assets/images/android-qr.svg"
-          alt="logo-home"
-          width="47%"
-          class="ml-auto rounded-lg float-right"
-        />
-      </v-card-text>
-      <v-card-actions>
-        <v-btn data-testid="close-1" color="red" @click="modalState = false">
-          Continue with Demo
-        </v-btn>
-        <v-spacer />
-        <v-btn
-          data-testid="confirm-1"
-          variant="flat"
-          color="success"
-          @click="
-            step2 = true;
-            modalState = false;
-          "
-        >
-          I have 3DICOM mobile installed
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-  <v-dialog v-model:model-value="step2">
-    <v-card
-      class="pa-1 ma-auto position-relative motif-background card-bg-border"
-      theme="dark"
-      max-width="680"
-    >
-      <v-card-title class="text-center mb-4 mt-2 font-weight-bold">
-        Load your scan
-      </v-card-title>
-      <v-card-text class="text-justify">
-        Once you have logged in and can see your dashboard, select your scan and
-        open it to visualise your X-Ray (XR), Ultrasound (US), Computed
-        Tomography (CT), Magnetic Resonance Imaging (MRI), and Positron Emitting
-        Tomography (PET) scans.
-      </v-card-text>
-      <v-card-actions>
-        <v-btn data-testid="close-2" color="red" @click="step2 = false"> Continue with Demo </v-btn>
-        <v-spacer />
-        <v-btn
-          data-testid="confirm-2"
-          variant="flat"
-          color="success"
-          @click="openUrl(PRICING_URL)"
-        >
-          I want to view my own scan
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-</template>
-
-<style scoped></style>

package/src/components/demo/patient/__tests__/DemoPatientEnableCloudStorageModal.spec.ts

@@ -1,38 +0,0 @@
-import { PRICING_URL } from '../../options';
-import { mount } from '@vue/test-utils';
-import DemoPatientEnableCloudStorageModal from '@/components/demo/patient/DemoPatientEnableCloudStorageModal.vue';
-import { VDialog } from 'vuetify/components';
-
-describe('DemoPatientEnableCloudStorageModal tests', () => {
-  it('should mount', () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientEnableCloudStorageModal, { props });
-    expect(wrapper).toBeTruthy();
-  });
-
-  it('should close modal', async () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientEnableCloudStorageModal, { props });
-    const close = wrapper.findComponent('[data-testid="close"]');
-    await close.trigger('click');
-    expect(wrapper.emitted('update:modal')).toBeTruthy();
-  });
-
-  it('should open pricing url', async () => {
-    vi.stubGlobal('open', vi.fn());
-    const spy = vi.spyOn(window, 'open');
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientEnableCloudStorageModal, { props });
-    const button = wrapper.findComponent('[data-testid="confirm"]');
-    await button.trigger('click');
-    expect(spy).toHaveBeenCalledWith(PRICING_URL, '_self');
-    vi.restoreAllMocks();
-  });
-
-  it('should open via input', async () => {
-    const props = { modal: false };
-    const wrapper = mount(DemoPatientEnableCloudStorageModal, { props });
-    const dialog = wrapper.findComponent(VDialog);
-    await dialog.setValue(true);
-  });
-});

package/src/components/demo/patient/__tests__/DemoPatientInfoModal.spec.ts

@@ -1,38 +0,0 @@
-import { mount } from '@vue/test-utils';
-import { PRICING_URL } from '@/components/demo/options';
-import { VDialog } from 'vuetify/components';
-import DemoPatientInfoModal from '@/components/demo/patient/DemoPatientInfoModal.vue';
-
-describe('DemoPatientInfoModal tests', () => {
-  it('should mount', () => {
-    const props = { modal: true, isModalOpen: true };
-    const wrapper = mount(DemoPatientInfoModal, { props });
-    expect(wrapper).toBeTruthy();
-  });
-
-  it('should close modal', async () => {
-    const props = { modal: true, isModalOpen: true };
-    const wrapper = mount(DemoPatientInfoModal, { props });
-    const close = wrapper.findComponent('[data-testid="close"]');
-    await close.trigger('click');
-    expect(wrapper.emitted('update:modal')).toBeTruthy();
-  });
-
-  it('should open support url', async () => {
-    vi.stubGlobal('open', vi.fn());
-    const spy = vi.spyOn(window, 'open');
-    const props = { modal: true, isModalOpen: true };
-    const wrapper = mount(DemoPatientInfoModal, { props });
-    const button = wrapper.findComponent('[data-testid="confirm"]');
-    await button.trigger('click');
-    expect(spy).toHaveBeenCalledWith(PRICING_URL, '_self');
-    vi.restoreAllMocks();
-  });
-
-  it('should open via input', async () => {
-    const props = { modal: false, isModalOpen: true };
-    const wrapper = mount(DemoPatientInfoModal, { props });
-    const dialog = wrapper.findComponent(VDialog);
-    await dialog.setValue(true);
-  });
-});

package/src/components/demo/patient/__tests__/DemoPatientSendToPartyModal.spec.ts

@@ -1,36 +0,0 @@
-import { mount } from '@vue/test-utils';
-import { VDialog, VTextField } from 'vuetify/components';
-import DemoPatientSendToPartyModal from '@/components/demo/patient/DemoPatientSendToPartyModal.vue';
-
-describe('DemoPatientSendToPartyModal tests', () => {
-  it('should mount', () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientSendToPartyModal, { props });
-    expect(wrapper).toBeTruthy();
-  });
-
-  it('should close modal', async () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientSendToPartyModal, { props });
-    const close = wrapper.findComponent('[data-testid="close"]');
-    await close.trigger('click');
-    expect(wrapper.emitted('update:modal')).toBeTruthy();
-  });
-
-  it('should enter email', async () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientSendToPartyModal, { props });
-    const input = wrapper.getComponent(VTextField);
-    await input.setValue('example@singular.health');
-    await input.trigger('keyup.enter');
-    const confirm = wrapper.findComponent('[data-testid="confirm"]');
-    await confirm.trigger('click');
-  });
-
-  it('should open via input', async () => {
-    const props = { modal: false };
-    const wrapper = mount(DemoPatientSendToPartyModal, { props });
-    const dialog = wrapper.findComponent(VDialog);
-    await dialog.setValue(true);
-  });
-});

package/src/components/demo/patient/__tests__/DemoPatientShareToMobileModal.spec.ts

@@ -1,52 +0,0 @@
-import { PRICING_URL } from '../../options';
-import { mount } from '@vue/test-utils';
-import { VDialog } from 'vuetify/components';
-import DemoPatientShareToMobileModal from '@/components/demo/patient/DemoPatientShareToMobileModal.vue';
-
-describe('DemoPatientShareToMobileModal tests', () => {
-  it('should mount', () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientShareToMobileModal, { props });
-    expect(wrapper).toBeTruthy();
-  });
-
-  it('should close modal', async () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientShareToMobileModal, { props });
-    const close = wrapper.findComponent('[data-testid="close-1"]');
-    await close.trigger('click');
-    expect(wrapper.emitted('update:modal')).toBeTruthy();
-  });
-
-  it('should go to next step and open url', async () => {
-    vi.stubGlobal('open', vi.fn());
-    const spy = vi.spyOn(window, 'open');
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientShareToMobileModal, { props });
-    const confirm1 = wrapper.findComponent('[data-testid="confirm-1"]');
-    await confirm1.trigger('click');
-    expect(wrapper.emitted('update:modal')).toBeTruthy();
-    const confirm2 = wrapper.findComponent('[data-testid="confirm-2"]');
-    await confirm2.trigger('click');
-    expect(spy).toHaveBeenCalledWith(PRICING_URL, '_self');
-    vi.restoreAllMocks();
-  });
-
-  it('should go to next step and close', async () => {
-    const props = { modal: true };
-    const wrapper = mount(DemoPatientShareToMobileModal, { props });
-    const confirm1 = wrapper.findComponent('[data-testid="confirm-1"]');
-    await confirm1.trigger('click');
-    expect(wrapper.emitted('update:modal')).toBeTruthy();
-    const close2 = wrapper.findComponent('[data-testid="close-2"]');
-    await close2.trigger('click');
-    expect(wrapper.text()).toBe('');
-  });
-
-  it('should open via input', async () => {
-    const props = { modal: false };
-    const wrapper = mount(DemoPatientShareToMobileModal, { props });
-    const dialog = wrapper.findComponent(VDialog);
-    await dialog.setValue(true);
-  });
-});

package/src/components/modal/CloseViewerModal.vue

@@ -1,69 +0,0 @@
-<template>
-  <v-dialog data-testid="dialog" v-model="modalState">
-    <v-card class="pa-1 ma-auto position-relative motif-background" width="600" theme="dark">
-      <v-card-title class="text-center">Close Viewer?</v-card-title>
-      <v-card-text class="text-center mb-2"> Are you sure you want to close the Online Viewer? </v-card-text>
-      <v-card-actions>
-        <v-btn data-testid="cancel" variant="text" @click="modalState = false"> Cancel </v-btn>
-        <v-spacer />
-        <v-btn v-if="options?.OnSaveSession" data-testid="close" color="red" variant="flat" @click="closeModal">
-          Close without saving
-        </v-btn>
-        <v-btn v-if="options?.OnSaveSession" data-testid="save" color="primary" variant="flat" @click="closeModalSave">
-          Save Session
-        </v-btn>
-        <v-btn data-testid="close" color="flat" variant="tonal" @click="closeModal" v-else> Close Viewer </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue';
-import { dataOverlayState, mcadObjectState, scanState } from '@/models/scanState';
-import { useViewerOptions } from '@/composables/useViewerOptions';
-
-interface Props {
-  modal?: boolean;
-}
-
-type Emits = {
-  'update:modal': [boolean];
-  close: [void];
-};
-
-const props = withDefaults(defineProps<Props>(), {
-  modal: false
-});
-
-const emit = defineEmits<Emits>();
-
-const options = useViewerOptions();
-
-const modalState = computed({
-  get(): boolean {
-    return props.modal;
-  },
-  set(value: boolean): void {
-    emit('update:modal', value);
-  }
-});
-
-async function closeModal(): Promise<void> {
-  if (options.value.OnExitViewer) {
-    await options.value.OnExitViewer();
-  }
-  modalState.value = false;
-  emit('close');
-}
-
-async function closeModalSave(): Promise<void> {
-  if (options.value.OnSaveSession) {
-    const scan = scanState.value;
-    const dataOverlay = dataOverlayState.value.DataOverlay;
-    const mcad = mcadObjectState.value.Models;
-    options.value.OnSaveSession(scan, dataOverlay, mcad);
-  }
-  await closeModal();
-}
-</script>