Skip to content

Commit b61905b

Browse files
josecelanojosecelano
committed
Merge #297: Show torrent fields: creation_date, created_by, encoding
4281526 refactor: [#297] code cleanup (Mario) 489da9d refactor: [#297] refactored error control (Mario) e4772ae refactor: [#297] new error checks and refactoring (Mario) 5bad420 refactor: [#297] added error checks (Mario) 3f09085 refactor: [#297] Creation date now display as UTC (Mario) 56af742 feat: [#278] show torrent fields creation date created by encoding (MMelchor) Pull request description: Resolves #278. ACKs for top commit: josecelano: ACK 4281526 Tree-SHA512: e5fad74903e2786b5803ac15ce11ea589d6d49263be99d09e5c2616092dd992433e72f97ce4193da02a5344db501f6e3872264477edcff1cff386fc0034ecda2
2 parents 0b63fb6 + 4281526 commit b61905b

File tree

5 files changed

+166
-0
lines changed

5 files changed

+166
-0
lines changed

‎components/torrent/TorrentCreatedByTab.vue‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<template>
2+
<div id="torrent-created-by" class="flex flex-col gap-6">
3+
<div class="flex flex-row items-center justify-between">
4+
<h2 class="mr-1 text-2xl font-medium text-left text-neutral-content/50">
5+
Created by
6+
</h2>
7+
<button
8+
class="flex flex-col items-center justify-center w-10 h-10 duration-200 bg-transparent text-base-content/50 hover:text-base-content rounded-xl"
9+
@click="collapsed = !collapsed"
10+
>
11+
<ChevronDownIcon class="w-6" :class="{ 'rotate-90': collapsed }" />
12+
</button>
13+
</div>
14+
<template v-if="!collapsed">
15+
<div class="flex flex-col w-full h-full p-6 grow bg-base-100 rounded-2xl">
16+
<template v-if="torrent.created_by">
17+
<Markdown :source="torrent.created_by" />
18+
</template>
19+
<template v-else>
20+
<span class="italic text-neutral-content">No created by field provided.</span>
21+
</template>
22+
</div>
23+
</template>
24+
</div>
25+
</template>
26+
27+
<script setup lang="ts">
28+
import { ChevronDownIcon } from "@heroicons/vue/24/solid";
29+
import { TorrentResponse } from "torrust-index-types-lib";
30+
import { PropType } from "vue";
31+
import { ref } from "#imports";
32+
import Markdown from "~/components/Markdown.vue";
33+
34+
const collapsed = ref(false);
35+
36+
const props = defineProps({
37+
torrent: {
38+
type: Object as PropType<TorrentResponse>,
39+
required: true
40+
}
41+
});
42+
</script>
43+
44+
<style scoped>
45+
46+
</style>

‎components/torrent/TorrentCreationDateTab.vue‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<template>
2+
<div id="torrent-creation-date" class="flex flex-col gap-6">
3+
<div class="flex flex-row items-center justify-between">
4+
<h2 class="mr-1 text-2xl font-medium text-left text-neutral-content/50">
5+
Creation Date
6+
</h2>
7+
<button
8+
class="flex flex-col items-center justify-center w-10 h-10 duration-200 bg-transparent text-base-content/50 hover:text-base-content rounded-xl"
9+
@click="collapsed = !collapsed"
10+
>
11+
<ChevronDownIcon class="w-6" :class="{ 'rotate-90': collapsed }" />
12+
</button>
13+
</div>
14+
<template v-if="!collapsed">
15+
<div class="flex flex-col w-full h-full p-6 grow bg-base-100 rounded-2xl">
16+
<template v-if="torrent.creation_date">
17+
{{ formatedDateFromTimestamp }}
18+
</template>
19+
<template v-else>
20+
<span class="italic text-neutral-content">No creation date provided.</span>
21+
</template>
22+
</div>
23+
</template>
24+
</div>
25+
</template>
26+
27+
<script setup lang="ts">
28+
import { ChevronDownIcon } from "@heroicons/vue/24/solid";
29+
import { TorrentResponse } from "torrust-index-types-lib";
30+
import { PropType } from "vue";
31+
import { ref } from "#imports";
32+
import Markdown from "~/components/Markdown.vue";
33+
import { formatTimestamp } from "~/src/helpers/DateConverter";
34+
35+
const collapsed = ref(false);
36+
37+
const props = defineProps({
38+
torrent: {
39+
type: Object as PropType<TorrentResponse>,
40+
required: true
41+
}
42+
});
43+
44+
const formatedDateFromTimestamp = formatTimestamp(props.torrent.creation_date);
45+
46+
</script>
47+
48+
<style scoped>
49+
50+
</style>

‎components/torrent/TorrentDetails.vue‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,9 @@
1717
<div v-if="torrent" class="flex flex-col flex-auto w-full gap-6">
1818
<TorrentDescriptionTab :torrent="torrent" @updated="reloadTorrent" />
1919
<TorrentCommentTab :torrent="torrent" @updated="reloadTorrent" />
20+
<TorrentCreationDateTab :torrent="torrent" @updated="reloadTorrent" />
21+
<TorrentCreatedByTab :torrent="torrent" @updated="reloadTorrent" />
22+
<TorrentEncodingTab :torrent="torrent" @updated="reloadTorrent" />
2023
<TorrentFilesTab :torrent="torrent" @updated="reloadTorrent" />
2124
<TorrentTrackersTab :torrent="torrent" @updated="reloadTorrent" />
2225
</div>

‎components/torrent/TorrentEncodingTab.vue‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<template>
2+
<div id="torrent-encoding" class="flex flex-col gap-6">
3+
<div class="flex flex-row items-center justify-between">
4+
<h2 class="mr-1 text-2xl font-medium text-left text-neutral-content/50">
5+
Encoding
6+
</h2>
7+
<button
8+
class="flex flex-col items-center justify-center w-10 h-10 duration-200 bg-transparent text-base-content/50 hover:text-base-content rounded-xl"
9+
@click="collapsed = !collapsed"
10+
>
11+
<ChevronDownIcon class="w-6" :class="{ 'rotate-90': collapsed }" />
12+
</button>
13+
</div>
14+
<template v-if="!collapsed">
15+
<div class="flex flex-col w-full h-full p-6 grow bg-base-100 rounded-2xl">
16+
<template v-if="torrent.encoding">
17+
<Markdown :source="torrent.encoding" />
18+
</template>
19+
<template v-else>
20+
<span class="italic text-neutral-content">No encoding provided.</span>
21+
</template>
22+
</div>
23+
</template>
24+
</div>
25+
</template>
26+
27+
<script setup lang="ts">
28+
import { ChevronDownIcon } from "@heroicons/vue/24/solid";
29+
import { TorrentResponse } from "torrust-index-types-lib";
30+
import { PropType } from "vue";
31+
import { ref } from "#imports";
32+
import Markdown from "~/components/Markdown.vue";
33+
34+
const collapsed = ref(false);
35+
36+
const props = defineProps({
37+
torrent: {
38+
type: Object as PropType<TorrentResponse>,
39+
required: true
40+
}
41+
});
42+
</script>
43+
44+
<style scoped>
45+
46+
</style>

‎src/helpers/DateConverter.ts‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
type UnixTimestamp = number;
2+
type FormattedDate = string;
3+
4+
class InvalidDateError extends Error {}
5+
6+
/**
7+
* Takes the date in seconds from Unix Epoch time and converts it to human readable format.
8+
*
9+
* For example: 1701688451 -> "Mon Dec 04 2023"
10+
*/
11+
12+
export function formatTimestamp (creationDate: UnixTimestamp): FormattedDate | Error {
13+
const milliseconds = creationDate * 1000;
14+
15+
const convertedDate = new Date(milliseconds);
16+
17+
return isNaN(convertedDate.valueOf())
18+
? new InvalidDateError(
19+
`Invalid date. Could not create a new date from timestamp value: ${creationDate}`)
20+
: convertedDate.toDateString();
21+
}

0 commit comments

Comments
 (0)