fix: not found jobs to return 404 instead 500

rotki · Aug 22, 2023 · 9cdfa43 · 9cdfa43
1 parent b94e9c3
commit 9cdfa43
Show file tree

Hide file tree

Showing 3 changed files with 104 additions and 84 deletions.
diff --git a/components/jobs/JobDetail.vue b/components/jobs/JobDetail.vue
@@ -0,0 +1,88 @@
+<script setup lang="ts">
+import { get } from '@vueuse/core';
+import { type JobMarkdownContent } from '~/composables/markdown';
+
+const props = defineProps<{
+ data: JobMarkdownContent;
+}>();
+
+const { data } = toRefs(props);
+
+const separatedData: ComputedRef<{
+ default: JobMarkdownContent;
+ blockquote: JobMarkdownContent;
+}> = computed(() => {
+ const regularItems = [];
+ const blockquoteItems = [];
+
+ const dataVal = get(data);
+
+ for (const item of dataVal.body.children) {
+ if (item.tag !== 'blockquote') {
+ regularItems.push(item);
+ } else {
+ blockquoteItems.push(item);
+ }
+ }
+
+ return {
+ default: {
+ ...dataVal,
+ body: {
+ ...dataVal.body,
+ children: regularItems,
+ },
+ },
+ blockquote: {
+ ...dataVal,
+ body: {
+ ...dataVal.body,
+ children: blockquoteItems,
+ },
+ },
+ };
+});
+
+const { t } = useI18n();
+</script>
+
+<template>
+ <div class="py-8 lg:py-20">
+ <div class="container flex flex-col lg:flex-row">
+ <div class="grow">
+ <ContentRenderer
+ v-if="separatedData.default"
+ :value="separatedData.default"
+ >
+ <ContentRendererMarkdown :value="separatedData.default" />
+ </ContentRenderer>
+ </div>
+ <div
+ v-if="separatedData.blockquote.body.children.length > 0"
+ class="mt-8 lg:mt-0 lg:pl-16 xl:pl-24"
+ >
+ <div class="bg-rui-primary/[.04] p-6 lg:w-[384px]">
+ <div class="flex">
+ <div class="bg-white rounded-lg p-3 text-rui-primary">
+ <RuiIcon name="lightbulb-line" />
+ </div>
+ </div>
+ <ContentRenderer
+ v-if="separatedData.blockquote"
+ :value="separatedData.blockquote"
+ >
+ <ContentRendererMarkdown :value="separatedData.blockquote" />
+ </ContentRenderer>
+ <ButtonLink
+ to="mailto:careers@rotki.com"
+ external
+ color="primary"
+ variant="default"
+ >
+ {{ t('actions.apply') }}
+ </ButtonLink>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
diff --git a/composables/markdown.ts b/composables/markdown.ts
@@ -66,19 +66,25 @@ export const useMarkdownContent = () => {
  const queryPrefixForJob = async (
  prefix: typeof CONTENT_PREFIX,
  path: string,
- ): Promise<JobMarkdownContent> => {
+ ): Promise<JobMarkdownContent | null> => {
  const prefixedPath = `${prefix}${path}`;
- const data = await queryContent<JobMarkdownContent>(prefixedPath).findOne();
- return {
- ...data,
- link: replacePathPrefix(prefix, data?._path),
- };
+ try {
+ const data = await queryContent<JobMarkdownContent>(
+ prefixedPath,
+ ).findOne();
+ return {
+ ...data,
+ link: replacePathPrefix(prefix, data?._path),
+ };
+ } catch {
+ return null;
+ }
  };
 
  /**
  * fetches a single markdown files within the jobs directory
  */
- const loadJob = async (path: string): Promise<JobMarkdownContent> => {
+ const loadJob = async (path: string): Promise<JobMarkdownContent | null> => {
  try {
  // try to fetch from prefix
  return await queryPrefixForJob(CONTENT_PREFIX, path);

diff --git a/pages/jobs/[id].vue b/pages/jobs/[id].vue
@@ -1,9 +1,6 @@
 <script lang="ts" setup>
 import { commonAttrs, getMetadata } from '~/utils/metadata';
-import {
- type JobMarkdownContent,
- useMarkdownContent,
-} from '~/composables/markdown';
+import { useMarkdownContent } from '~/composables/markdown';
 
 const {
  public: { baseUrl },
@@ -12,38 +9,6 @@ const { path } = useRoute();
 const { loadJob } = useMarkdownContent();
 
 const data = await loadJob(path);
-const separatedData: ComputedRef<{
- default: JobMarkdownContent;
- blockquote: JobMarkdownContent;
-}> = computed(() => {
- const regularItems = [];
- const blockquoteItems = [];
-
- for (const item of data.body.children) {
- if (item.tag !== 'blockquote') {
- regularItems.push(item);
- } else {
- blockquoteItems.push(item);
- }
- }
-
- return {
- default: {
- ...data,
- body: {
- ...data.body,
- children: regularItems,
- },
- },
- blockquote: {
- ...data,
- body: {
- ...data.body,
- children: blockquoteItems,
- },
- },
- };
-});
 
 if (!data?.open) {
  showError({ message: `Page not found: ${path}`, statusCode: 404 });
@@ -65,50 +30,11 @@ if (!data?.open) {
 definePageMeta({
  layout: false,
 });
-
-const { t } = useI18n();
 </script>
 
 <template>
- <NuxtLayout name="jobs">
+ <NuxtLayout v-if="data" name="jobs">
  <template #title>{{ data.title }}</template>
- <div class="py-8 lg:py-20">
- <div class="container flex flex-col lg:flex-row">
- <div class="grow">
- <ContentRenderer
- v-if="separatedData.default"
- :value="separatedData.default"
- >
- <ContentRendererMarkdown :value="separatedData.default" />
- </ContentRenderer>
- </div>
- <div
- v-if="separatedData.blockquote.body.children.length > 0"
- class="mt-8 lg:mt-0 lg:pl-16 xl:pl-24"
- >
- <div class="bg-rui-primary/[.04] p-6 lg:w-[384px]">
- <div class="flex">
- <div class="bg-white rounded-lg p-3 text-rui-primary">
- <RuiIcon name="lightbulb-line" />
- </div>
- </div>
- <ContentRenderer
- v-if="separatedData.blockquote"
- :value="separatedData.blockquote"
- >
- <ContentRendererMarkdown :value="separatedData.blockquote" />
- </ContentRenderer>
- <ButtonLink
- to="mailto:careers@rotki.com"
- external
- color="primary"
- variant="default"
- >
- {{ t('actions.apply') }}
- </ButtonLink>
- </div>
- </div>
- </div>
- </div>
+ <JobDetail :data="data" />
  </NuxtLayout>
 </template>