Refactor DI for simplicity and type safety

This commit improves the dependency injection mechanism by introducing a
custom `injectKey` function.

Key improvements are:

- Enforced type consistency during dependency registration and
  instantiation.
- Simplified injection process, abstracting away the complexity with a
  uniform API, regardless of the dependency's lifetime.
- Eliminated the possibility of `undefined` returns during dependency
  injection, promoting fail-fast behavior.
- Removed the necessity for type casting to `symbol` for injection keys
  in unit tests by using existing types.
- Consalidated imports, combining keys and injection functions in one
  `import` statement.
This commit is contained in:
undergroundwires
2023-11-09 13:17:38 +01:00
parent aab0f7ea46
commit 7770a9b521
51 changed files with 398 additions and 177 deletions

View File

@@ -18,9 +18,9 @@
</template>
<script lang="ts">
import { defineComponent, inject } from 'vue';
import { defineComponent } from 'vue';
import { OperatingSystem } from '@/domain/OperatingSystem';
import { InjectionKeys } from '@/presentation/injectionSymbols';
import { injectKey } from '@/presentation/injectionSymbols';
import AppIcon from '@/presentation/components/Shared/Icon/AppIcon.vue';
import DownloadUrlListItem from './DownloadUrlListItem.vue';
@@ -36,7 +36,7 @@ export default defineComponent({
AppIcon,
},
setup() {
const { os: currentOs } = inject(InjectionKeys.useRuntimeEnvironment);
const { os: currentOs } = injectKey((keys) => keys.useRuntimeEnvironment);
const supportedDesktops = [
...supportedOperativeSystems,
].sort((os) => (os === currentOs ? 0 : 1));

View File

@@ -12,9 +12,8 @@
<script lang="ts">
import {
defineComponent, PropType, computed,
inject,
} from 'vue';
import { InjectionKeys } from '@/presentation/injectionSymbols';
import { injectKey } from '@/presentation/injectionSymbols';
import { OperatingSystem } from '@/domain/OperatingSystem';
export default defineComponent({
@@ -25,8 +24,8 @@ export default defineComponent({
},
},
setup(props) {
const { info } = inject(InjectionKeys.useApplication);
const { os: currentOs } = inject(InjectionKeys.useRuntimeEnvironment);
const { info } = injectKey((keys) => keys.useApplication);
const { os: currentOs } = injectKey((keys) => keys.useRuntimeEnvironment);
const isCurrentOs = computed<boolean>(() => {
return currentOs === props.operatingSystem;

View File

@@ -41,13 +41,13 @@
</template>
<script lang="ts">
import { defineComponent, computed, inject } from 'vue';
import { InjectionKeys } from '@/presentation/injectionSymbols';
import { defineComponent, computed } from 'vue';
import { injectKey } from '@/presentation/injectionSymbols';
export default defineComponent({
setup() {
const { info } = inject(InjectionKeys.useApplication);
const { isDesktop } = inject(InjectionKeys.useRuntimeEnvironment);
const { info } = injectKey((keys) => keys.useApplication);
const { isDesktop } = injectKey((keys) => keys.useRuntimeEnvironment);
const repositoryUrl = computed<string>(() => info.repositoryUrl);
const feedbackUrl = computed<string>(() => info.feedbackUrl);

View File

@@ -45,11 +45,11 @@
<script lang="ts">
import {
defineComponent, ref, computed, inject,
defineComponent, ref, computed,
} from 'vue';
import ModalDialog from '@/presentation/components/Shared/Modal/ModalDialog.vue';
import AppIcon from '@/presentation/components/Shared/Icon/AppIcon.vue';
import { InjectionKeys } from '@/presentation/injectionSymbols';
import { injectKey } from '@/presentation/injectionSymbols';
import DownloadUrlList from './DownloadUrlList.vue';
import PrivacyPolicy from './PrivacyPolicy.vue';
@@ -61,8 +61,8 @@ export default defineComponent({
AppIcon,
},
setup() {
const { info } = inject(InjectionKeys.useApplication);
const { isDesktop } = inject(InjectionKeys.useRuntimeEnvironment);
const { info } = injectKey((keys) => keys.useApplication);
const { isDesktop } = injectKey((keys) => keys.useRuntimeEnvironment);
const isPrivacyDialogVisible = ref(false);