feat: add release timeline

docs/.vitepress/config/index.ts

@@ -7,6 +7,7 @@ import sidebar_book_ru from "./sidebar.book.ru";
 import sidebar_vue_webapp_ru from "./sidebar.vue-webapp.ru";
 import sidebar_vue_webapp_en from "./sidebar.vue-webapp.en";
 import sidebar_arty_crafty_ru from "./sidebar.arty-crafty.ru";
+import sidebar_release_timeline_ru from "./sidebar.release-timeline.ru";
 
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
@@ -23,6 +24,7 @@ export default defineConfig({
           "/ru/book/": sidebar_book_ru,
           "/ru/vue-webapp/": sidebar_vue_webapp_ru,
           "/ru/arty-crafty/": sidebar_arty_crafty_ru,
+          "/ru/release-timeline/": sidebar_release_timeline_ru,
         },
         lastUpdated: {
           text: "Последнее обновление",

docs/.vitepress/config/nav.ru.ts

@@ -3,6 +3,7 @@ export default [
   { text: "FAQ", link: "/ru/misc/introduction" },
   { text: "Учебник", link: "/ru/book/" },
   { text: "vue-webapp", link: "/ru/vue-webapp/" },
+  { text: "Release Timeline", link: "/ru/release-timeline/" },
   { text: "Arty-Crafty", link: "/ru/arty-crafty/" },
   { text: "Статьи", link: "/ru/articles/" },
   {

docs/.vitepress/config/sidebar.release-timeline.ru.ts

@@ -0,0 +1,7 @@
+export default [
+  { text: "О библиотеке", link: "/ru/release-timeline/index" },
+  { text: "Установка", link: "/ru/release-timeline/getting-started" },
+  // { text: "Конфигурация", link: "/ru/release-timeline/config" },
+  { text: "Конфигурация", link: "/ru/release-timeline/config" },
+  { text: "Получение данных о релизах", link: "/ru/release-timeline/release-data" },
+];

docs/ru/misc/CHANGELOG.md

@@ -1,75 +1,14 @@
-# История изменений
+<script setup>
+// import { ReleaseTimeline, DefaultOptions as options } from "release-timeline";
+import { DefaultOptions as options } from "release-timeline";
+import "release-timeline/dist/style.css";
+import "release-timeline/dist/animated-background.css";
+import ReleaseTimeline from '../../../../Vuesence/release-timeline/src/ReleaseTimeline.vue'
+// import { DefaultOptions as options } from "./utils";
 
-<br />
+options.github.owner = "vuesence";
+options.github.repo = "arty-crafty";
 
-## v1.4 (24-11-2023)
+</script>
 
-#### Новое
-
-- `Перевод книги 'Vue.js 3 Design Patterns and Best Practices'`
-- `vue-webapp`
-
-#### Изменено
-
-- `Фронтенд / Как изучать Vue?`
-
-<!-- --- -->
-
-<br />
-<br />
-
-## v1.3 (10-10-2023)
-
-<!-- #### Новое -->
-
-<!-- - `Деплой на сервере / Github Actions` -->
-
-#### Изменено
-
-- `Общение с бэкендом / CORS`
-- `Фронтенд / Как изучать Vue?`
-- `Разработка / Полезные советы`
-
-<!-- --- -->
-
-<br />
-<br />
-
-## v1.2 (27-09-2023)
-
-#### Новое
-
-- `Деплой на сервере / Github Actions`
-
-#### Изменено
-
-- `Деплой на сервере / CI/CD`
-- `Разработка / Сторы - Vuex, Pinia и Composition API`
-- `Фронтенд / О фронтенд фреймворках`
-- Несущественные изменения и исправление ошибок в разных разделах
-
-<!-- --- -->
-
-<br />
-<br />
-
-## v1.1 (15-09-2023)
-
-### Новое
-
-- `Разработка / Сторы`
-
-### Изменено
-
-- `Разработка / Полезные советы`
-
-<!-- --- -->
-
-<br />
-<br />
-
-## v1.0 (11-09-2023)
-
-### Новое
-
-- Начальный запуск
+<ReleaseTimeline :options="options" />

docs/ru/release-timeline/config.md

@@ -0,0 +1,45 @@
+---
+pageClass: release-timeline
+head:
+  - - meta
+    - name: og:site_name
+      content: Release timeline - visual component displaying GitHub release timeline
+  - - meta
+    - name: og:image
+      content: /images/vue-faq-logo.png
+  - - meta
+    - name: twitter:image
+      content: /images/vue-faq-logo.png
+---
+
+# Конфигурация
+
+## Конфигурационный файл
+
+```js
+export const DefaultOptions = {
+  github: {
+    owner: "vuejs",
+    repo: "vitepress",
+    // number of releases to request
+    size: 20,
+    // GitHub API token for accessing private repositories
+    token: "",
+    // feedType: github or url
+    feedType: "github",
+    // url if getting data not from GitHub
+    url: "",
+  },
+  timeline: {
+    // Both coefficients below have to be chosen experimentally
+    paddingTop: 0.1,
+    // Affects the extent of the vertical line lengths when there is a
+    // large gap in the dates dates between neighboring releases
+    span: 200,
+  },
+  display: {
+    releaseName: true,
+    animatedBackground: true,
+  },
+};
+```

docs/ru/release-timeline/getting-started.md

@@ -0,0 +1,41 @@
+---
+pageClass: release-timeline
+head:
+  - - meta
+    - name: og:site_name
+      content: Release timeline - visual component displaying GitHub release timeline
+  - - meta
+    - name: og:image
+      content: /images/vue-faq-logo.png
+  - - meta
+    - name: twitter:image
+      content: /images/vue-faq-logo.png
+---
+
+# Установка
+
+## Установка пакета
+
+```bash [pnpm]
+pnpm add release-timeline
+```
+
+## Использованиe в коде
+
+<!-- In your code: -->
+
+```vue
+<script setup>
+import { ReleaseTimeline, DefaultOptions as options } from "release-timeline";
+import "release-timeline/dist/style.css";
+// import "release-timeline/dist/animated-background.css";
+
+// configure options
+options.github.owner = "vuesence";
+options.github.repo = "arty-crafty";
+</script>
+
+<ReleaseTimeline :options="options" />
+```
+
+Подключение `animated-background.css` опционально. CSS со звездным небом занимает 70Kb.

docs/ru/release-timeline/index.md

@@ -0,0 +1,27 @@
+---
+pageClass: release-timeline
+head:
+  - - meta
+    - name: og:site_name
+      content: Release timeline - visual component displaying GitHub release timeline
+  - - meta
+    - name: og:image
+      content: /images/vue-faq-logo.png
+  - - meta
+    - name: twitter:image
+      content: /images/vue-faq-logo.png
+---
+
+# Release Timeline
+
+## Визуализация релизов ПО по временной шкале
+
+![image](/ru/release-timeline/assets/images/rt-image.jpg)
+
+Vue 3, без зависимостей, 9Кб в распакованном виде. Адаптирована для работы в VitePress (переключение светлой и темной тем).
+
+Библиотека обращается в GitHub REST API за данными по релизам определенного репозитория и визуализирует их.
+
+## To Do
+
+Планируется добавить commits и pull requests к каждому релизу

docs/ru/release-timeline/release-data.md

@@ -0,0 +1,29 @@
+---
+pageClass: release-timeline
+head:
+  - - meta
+    - name: og:site_name
+      content: Release timeline - visual component displaying GitHub release timeline
+  - - meta
+    - name: og:image
+      content: /images/vue-faq-logo.png
+  - - meta
+    - name: twitter:image
+      content: /images/vue-faq-logo.png
+---
+
+# Данные релизов и пул риквестов
+
+## Получение данных
+
+Есть три варианта получения данных с релизами с GitHub-а
+
+1. Динамическое. Прямой запрос к GitHub REST API во время открытия страницы.
+2. Запрос к GitHub REST API через прокси
+3. Запрос к GitHub REST API во время билда проекта, оптимизация и сохранение данных локально на сайте.
+
+На данный момент реализован только 1. вариант.
+
+Второй вариант нужен для уменьшения размера загружаемого файла.
+
+Третий вариант так же может оптимизировать потоки данных, но делает снэпшот релизов и рул риквестов на определенный момент времени. При выходе нового релиза потребуется пересобрать документацию.

package.json

@@ -9,6 +9,7 @@
     "preview": "vitepress preview docs"
   },
   "dependencies": {
+    "release-timeline": "^0.3.0",
     "vue": "^3.4.13",
     "vue3-toastify": "^0.1.14"
   },