Merge do wersji 1.16.2

bump: 1.16.2
hotfix
2026-05-03 05:18:11 +00:00 · 2023-07-01 01:25:10 +02:00 · 2023-07-01 01:20:04 +02:00 · 2023-07-01 01:19:50 +02:00 · 2023-06-30 20:50:03 +02:00 · 2023-06-27 02:52:41 +02:00
84 changed files with 14791 additions and 13945 deletions
@@ -5,8 +5,8 @@
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
-    <meta name="keywords" content="Stacjownik, TD2, Train Driver 2, stacjownik-td2" />
+    <meta name="keywords" content="Stacjownik, TD2, Train Driver 2, stacjownik-td2, stacjownik, td2.info.pl" />
-    <meta name="description" content="Automatycznie odświeżana strona wyświetlająca stacje w Train Driver 2!" />
+    <meta name="description" content="Pomocnik maszynisty i dyżurnego symulatora Train Driver 2" />
    <title>Stacjownik</title>
@@ -24,7 +24,7 @@
    <link rel="icon" href="favicon-16.png" sizes="16x16" type="image/png" />
    <link rel="icon" href="favicon.ico" />
-    <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;700&display=swap" rel="stylesheet" />
+    <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@500;700&display=swap" rel="stylesheet" />
  </head>
  <body>
@@ -32,3 +32,4 @@
    <script type="module" src="/src/main.ts"></script>
  </body>
 </html>
@@ -1,12 +1,12 @@
 {
  "name": "stacjownik",
-  "version": "1.11.0",
+  "version": "1.16.0.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "stacjownik",
-      "version": "1.11.0",
+      "version": "1.16.0.1",
      "dependencies": {
        "core-js": "^3.12.1",
        "dotenv": "^16.0.3",
@@ -3465,9 +3465,9 @@
      }
    },
    "node_modules/caniuse-lite": {
-      "version": "1.0.30001441",
+      "version": "1.0.30001503",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001441.tgz",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001503.tgz",
-      "integrity": "sha512-OyxRR4Vof59I3yGWXws6i908EtGbMzVUi3ganaZQHmydk1iwDhRnvaPG2WaR0KcqrDFKrxVZHULT396LEPhXfg==",
+      "integrity": "sha512-Sf9NiF+wZxPfzv8Z3iS0rXM1Do+iOy2Lxvib38glFX+08TCYYYGR5fRJXk4d77C4AYwhUjgYgMsMudbh2TqCKw==",
      "dev": true,
      "funding": [
        {
@@ -3477,6 +3477,10 @@
        {
          "type": "tidelift",
          "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
        },
        {
          "type": "github",
          "url": "https://github.com/sponsors/ai"
        }
      ]
    },
@@ -9117,9 +9121,9 @@
      }
    },
    "caniuse-lite": {
-      "version": "1.0.30001441",
+      "version": "1.0.30001503",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001441.tgz",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001503.tgz",
-      "integrity": "sha512-OyxRR4Vof59I3yGWXws6i908EtGbMzVUi3ganaZQHmydk1iwDhRnvaPG2WaR0KcqrDFKrxVZHULT396LEPhXfg==",
+      "integrity": "sha512-Sf9NiF+wZxPfzv8Z3iS0rXM1Do+iOy2Lxvib38glFX+08TCYYYGR5fRJXk4d77C4AYwhUjgYgMsMudbh2TqCKw==",
      "dev": true
    },
    "chalk": {
@@ -1,6 +1,6 @@
 {
  "name": "stacjownik",
-  "version": "1.11.2",
+  "version": "1.16.2",
  "private": true,
  "scripts": {
    "dev": "vite",
@@ -46,7 +46,7 @@
  font-size: 1rem;
  @include smallScreen() {
-    font-size: calc(0.5rem + 1.1vw);
+    font-size: calc(0.55rem + 1.1vw);
  }
  @include screenLandscape() {
@@ -91,6 +91,11 @@ footer.app_footer {
  max-width: 100%;
  padding: 0.5em;
  img {
    width: 1.1em;
    vertical-align: text-bottom;
  }
  z-index: 10;
  background: #111;
@@ -23,6 +23,8 @@
      <a href="https://td2.info.pl/profile/?u=20777" target="_blank">Spythere</a>
      {{ new Date().getUTCFullYear() }} |
      <a :href="releaseURL" target="_blank">v{{ VERSION }}{{ isOnProductionHost ? '' : 'dev' }}</a>
      <br />
      <a href="https://discord.gg/x2mpNN3svk"><img :src="getIcon('discord', 'png')" alt="">&nbsp;<b>{{ $t('footer.discord') }}</b></a>
      <div style="display: none">&int; ukryta taktyczna całka do programowania w HTMLu</div>
    </footer>
@@ -1,18 +1,20 @@
 <svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="60" height="60" fill="#898989"/>
+<rect y="-0.00012207" width="60" height="60" fill="#898989"/>
-<path d="M30.5 6.04878H35.2195" stroke="#BFBFBF"/>
+<path d="M29.0126 32.4897V10.2511V9.52028H30.4337V10.2511V57.234H29.0126V32.4897Z" fill="#BFBFBF"/>
-<path d="M27.9024 4.00303C25.2115 4.10008 24.2403 6.24494 24 7.41767H32.0488C31.8486 6.16406 30.5934 3.90598 27.9024 4.00303Z" fill="black"/>
+<path d="M26.955 29.3992V32.9949L29.7672 36.9105" stroke="black" stroke-width="0.61183"/>
-<path d="M33.0244 29.6688V5.47793V4.68292H34.4878V5.47793V56.5854H33.0244V32.5H27.5V28.5V28.0163L28.5 28V31.5L31.9268 31.5447H33.0244V29.6688Z" fill="#BFBFBF"/>
+<rect x="29.0051" y="34.0686" width="1.42857" height="22.8196" fill="white"/>
-<path d="M28.1463 29.2683C30.8373 29.1712 31.8085 27.0264 32.0488 25.8537H24C24.2002 27.1073 25.4554 29.3654 28.1463 29.2683Z" fill="black"/>
+<rect x="29.0051" y="34.0686" width="1.42857" height="5.18627" fill="#FF0000"/>
-<path d="M32.0488 25.8537V7.86993V7.41464H24V25.8537H32.0488Z" fill="black"/>
+<rect x="29.0051" y="54.8137" width="1.42857" height="5.18627" fill="#FF0000"/>
-<path d="M25 26V29.5L33.8781 44.9756" stroke="black"/>
+<rect x="29.0051" y="44.4412" width="1.42857" height="5.18627" fill="#FF0000"/>
-<rect x="33.0244" y="31.5447" width="1.46341" height="25.0407" fill="white"/>
+<rect x="27.8749" y="31.8649" width="3.75" height="2.17823" fill="white"/>
-<rect x="33.0244" y="31.5447" width="1.46341" height="5.69106" fill="#FF0000"/>
+<path d="M33.5 28.5111V8.61545V8.11176H26V28.5111H33.5Z" fill="black"/>
-<rect x="33.0244" y="42.9268" width="1.46341" height="5.69106" fill="#FF0000"/>
+<path d="M29.6364 5.00276C27.1289 5.09112 26.2239 7.044 26 8.11176H33.5C33.3134 6.97036 32.1438 4.91439 29.6364 5.00276Z" fill="black"/>
-<rect x="33.0244" y="54.3089" width="1.46341" height="5.69106" fill="#FF0000"/>
+<path d="M29.8636 31.6201C32.3711 31.5317 33.2761 29.5789 33.5 28.5111H26C26.1865 29.6525 27.3561 31.7085 29.8636 31.6201Z" fill="black"/>
-<ellipse cx="27.9024" cy="7.40022" rx="1.46341" ry="1.40022" fill="#212121"/>
+<ellipse cx="29.887" cy="11.8168" rx="1.38696" ry="1.28474" fill="#212121"/>
-<ellipse cx="27.9024" cy="11.8343" rx="1.46341" ry="1.40022" fill="#212121"/>
+<ellipse cx="29.887" cy="8.0135" rx="1.38696" ry="1.28474" fill="#212121"/>
-<ellipse cx="27.9024" cy="16.2683" rx="1.46341" ry="1.40022" fill="#FF0000"/>
+<ellipse cx="29.887" cy="15.6151" rx="1.38696" ry="1.28474" fill="#212121"/>
-<ellipse cx="27.9024" cy="20.7023" rx="1.46341" ry="1.40022" fill="#212121"/>
+<ellipse cx="29.887" cy="19.6834" rx="1.38696" ry="1.28474" fill="#212121"/>
-<ellipse cx="27.9024" cy="25.1364" rx="1.46341" ry="1.40022" fill="#212121"/>
+<ellipse cx="29.887" cy="23.7518" rx="1.38696" ry="1.28474" fill="#212121"/>
 <ellipse cx="29.887" cy="27.8201" rx="1.38696" ry="1.28474" fill="#00FF0A"/>
 <ellipse cx="29.887" cy="19.769" rx="1.38696" ry="1.28474" fill="#00FF0A"/>
 </svg>
@@ -0,0 +1,3 @@
 <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M23.75 3.75H22.5V1.25H20V3.75H10V1.25H7.5V3.75H6.25C4.875 3.75 3.75 4.875 3.75 6.25V23.75C3.75 25.125 4.875 26.25 6.25 26.25H23.75C25.125 26.25 26.25 25.125 26.25 23.75V6.25C26.25 4.875 25.125 3.75 23.75 3.75ZM23.75 23.75H6.25V11.25H23.75V23.75ZM6.25 8.75V6.25H23.75V8.75H6.25ZM8.75 13.75H21.25V16.25H8.75V13.75ZM8.75 18.75H17.5V21.25H8.75V18.75Z" fill="#F2E147"/>
 </svg>
@@ -0,0 +1,3 @@
 <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M23.75 3.75H22.5V1.25H20V3.75H10V1.25H7.5V3.75H6.25C4.875 3.75 3.75 4.875 3.75 6.25V23.75C3.75 25.125 4.875 26.25 6.25 26.25H23.75C25.125 26.25 26.25 25.125 26.25 23.75V6.25C26.25 4.875 25.125 3.75 23.75 3.75ZM23.75 23.75H6.25V11.25H23.75V23.75ZM6.25 8.75V6.25H23.75V8.75H6.25ZM8.75 13.75H21.25V16.25H8.75V13.75ZM8.75 18.75H17.5V21.25H8.75V18.75Z" fill="#66FF6C"/>
 </svg>
@@ -0,0 +1,3 @@
 <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M23.75 3.75H22.5V1.25H20V3.75H10V1.25H7.5V3.75H6.25C4.875 3.75 3.75 4.875 3.75 6.25V23.75C3.75 25.125 4.875 26.25 6.25 26.25H23.75C25.125 26.25 26.25 25.125 26.25 23.75V6.25C26.25 4.875 25.125 3.75 23.75 3.75ZM23.75 23.75H6.25V11.25H23.75V23.75ZM6.25 8.75V6.25H23.75V8.75H6.25ZM8.75 13.75H21.25V16.25H8.75V13.75ZM8.75 18.75H17.5V21.25H8.75V18.75Z" fill="#898989"/>
 </svg>
@@ -6,16 +6,6 @@
          <img :src="getIcon('pl')" alt="icon-pl" @click="changeLang('en')" v-if="currentLang == 'pl'" />
          <img :src="getIcon('en', 'jpg')" alt="icon-en" @click="changeLang('pl')" v-else />
        </span>
        <span class="icons-bottom">
          <a href="https://www.paypal.com/paypalme/spythere" target="_blank">
            <img :src="getIcon('dollar')" alt="icon paypal" />
          </a>
          <a href="https://discord.gg/x2mpNN3svk" target="_blank">
            <img :src="getIcon('discord', 'png')" alt="icon discord" />
          </a>
        </span>
      </div>
      <div class="header_body">
@@ -33,6 +23,12 @@
          <div class="info_counter">
            <img :src="getIcon('dispatcher')" alt="icon dispatcher" />
            <span class="text--primary">{{ onlineDispatchersCount }}</span>
            <!-- <span class="g-tooltip">
              <b class="text--primary">{{ factorU }}U</b>
              <div class="content">Test</div>
            </span> -->
            <span class="text--grayed"> / </span>
            <span class="text--primary">{{ onlineTrainsCount }}</span>
            <img :src="getIcon('train')" alt="icon train" />
@@ -98,11 +94,17 @@ export default defineComponent({
    onlineTrainsCount() {
      return this.store.trainList.filter((train) => train.online).length;
    },
    onlineDispatchersCount() {
      return this.store.stationList.filter(
        (station) => station.onlineInfo && station.onlineInfo.region == this.store.region.id
      ).length;
    },
    factorU() {
      return this.onlineDispatchersCount == 0 ? '-' : (this.onlineTrainsCount / this.onlineDispatchersCount).toFixed(2);
    },
    computedRegions() {
      return options.regions.map((region) => {
        const regionStationCount =
@@ -135,22 +137,20 @@ export default defineComponent({
 .header {
  &_body {
    max-width: 21em;
    position: relative;
-
+    max-width: 20em;
    @include smallScreen {
      max-width: 18em;
    }
  }
  &_container {
    display: flex;
    justify-content: center;
    position: relative;
    width: 1350px;
    padding: 0.5em 0.3em 0 0.3em;
    border-radius: 0 0 1em 1em;
    @include smallScreen {
      position: relative;
      margin-top: 0.5em;
    }
  }
  &_brand {
@@ -158,6 +158,7 @@ export default defineComponent({
    img {
      width: 100%;
      margin: 0 auto;
    }
  }
@@ -165,9 +166,7 @@ export default defineComponent({
  &_info {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
-    max-width: 100%;
+    font-size: 1.15em;
    font-size: 1.2em;
  }
  &_links {
@@ -184,58 +183,21 @@ export default defineComponent({
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
-    display: flex;
+    padding: 0.5em;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 0.5em 0.5em;
-    @include smallScreen() {
+    @include smallScreen {
-      right: auto;
+      transform: translateX(85%);
      left: 0.75em;
      padding: 0;
      align-items: center;
    }
  }
 }
 // ICONS
-.icons {
+.icons-top {
  position: relative;
  &-top {
  img {
    width: 2.5em;
    cursor: pointer;
  }
    margin-bottom: 0.5em;
  }
  &-bottom {
    display: flex;
    a {
      margin-left: 0.6em;
      user-select: none;
    }
    img {
      width: 1.9em;
    }
    @include smallScreen() {
      flex-direction: column;
      a {
        margin: 0.25em 0;
      }
    }
  }
 }
 // COUNTER
@@ -164,7 +164,7 @@
 import { defineComponent } from 'vue';
 import { DataStatus } from '../../scripts/enums/DataStatus';
 import { useStore } from '../../store/store';
-import { StoreState } from '../../store/storeTypes';
+import { StoreState } from '../../scripts/interfaces/store/storeTypes';
 export default defineComponent({
  data() {
@@ -303,9 +303,11 @@ export default defineComponent({
 .status-indicator {
  position: absolute;
  left: 110%;
  bottom: 0;
  right: 0;
  z-index: 100;
  transform: translateX(1.5em);
 }
 .indicator {
@@ -330,7 +332,7 @@ export default defineComponent({
    background-color: #171717;
    border-radius: 0.75em;
-    min-width: 13em;
+    width: 13em;
    text-align: center;
    overflow: none;
@@ -354,22 +356,16 @@ export default defineComponent({
    }
    @include midScreen() {
-      left: 50%;
+      left: auto;
-      top: 100%;
+      right: 200%;
      transform: translate(-50%, 0);
      margin-left: 0;
      margin-top: 0.75em;
      &::before {
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
-        border-bottom: 10px solid #171717;
+        border-left: 12px solid #171717;
        right: 0;
        left: auto;
-        top: 0;
+        transform: translate(100%, -50%);
        left: 50%;
        transform: translate(-50%, -100%);
      }
    }
@@ -379,3 +375,4 @@ export default defineComponent({
  }
 }
 </style>
@@ -3,6 +3,10 @@
    <div class="select-box_content">
      <button class="selected" @click="toggleBox">
        <span>{{ computedSelectedItem.selectedValue || computedSelectedItem.value }}</span>
        <div class="arrow">
          <img :src="listOpen ? getIcon('arrow-asc') : getIcon('arrow-desc')" alt="arrow-icon" />
        </div>
      </button>
      <ul class="options" :ref="(el) => (listRef = el as Element)">
@@ -21,10 +25,6 @@
        </li>
      </ul>
    </div>
    <div class="arrow">
      <img :src="listOpen ? getIcon('arrow-asc') : getIcon('arrow-desc')" alt="arrow-icon" />
    </div>
  </div>
 </template>
@@ -129,46 +129,22 @@ export default defineComponent({
 }
 .select-box {
-  position: relative;
+  display: flex;
-  width: auto;
+  align-items: center;
 }
 .arrow {
  position: absolute;
  top: 50%;
  right: 0;
  padding: 0;
  img {
    vertical-align: middle;
    width: 1.35em;
  }
  transform: translateY(-50%);
  pointer-events: none;
 }
 button.selected {
  background-color: transparent;
  color: paleturquoise;
  font-size: 1em;
  font-weight: bold;
  padding: 0.1em 0.5em;
  margin-right: 2em;
  display: flex;
  width: 100%;
  cursor: pointer;
  border: none;
  outline: none;
  text-align: left;
  &:focus {
    background-color: #262626;
@@ -1,56 +1,62 @@
 <template>
  <section class="daily-stats">
-    <span :data-active="data.statsStatus">
+    <span :data-active="statsStatus">
-      <b v-if="data.statsStatus == DataStatus.Loading">
+      <b v-if="statsStatus == DataStatus.Loading">
        {{ $t('app.loading') }}
      </b>
-      <b v-else-if="data.stats.distanceSum == null">
+      <b v-else-if="stats.distanceSum == null">
        {{ $t('journal.daily-stats-info') }}
      </b>
-      <span>
+      <span class="stats-list" v-else>
-        <div v-if="data.stats.totalTimetables">
+        <h3>
          {{ $t('journal.daily-stats-title') }}
          <b class="text--primary">{{ new Date().toLocaleDateString($i18n.locale) }}</b>
        </h3>
        <hr style="margin-bottom: 0.5em" />
        <div v-if="stats.totalTimetables">
          &bull;
          <i18n-t keypath="journal.timetable-stats-total">
            <template #count>
              <b class="text--primary">
-                {{ data.stats.totalTimetables }}
+                {{ stats.totalTimetables }}
-                {{ $t('journal.timetable-count', data.stats.totalTimetables) }}
+                {{ $t('journal.timetable-count', stats.totalTimetables) }}
              </b>
            </template>
            <template #distance>
-              <b class="text--primary"> {{ data.stats.distanceSum?.toFixed(2) }} km </b>
+              <b class="text--primary"> {{ stats.distanceSum?.toFixed(2) }} km</b>
            </template>
          </i18n-t>
        </div>
-        <div v-if="data.stats.timetableId">
+        <div v-if="stats.timetableId">
          &bull;
          <i18n-t keypath="journal.timetable-stats-longest">
            <template #id>
-              <router-link :to="`/journal/timetables?timetableId=${data.stats.timetableId}`">
+              <router-link :to="`/journal/timetables?timetableId=${stats.timetableId}`">
-                <b>{{ data.stats.timetableId }}</b>
+                <b>{{ stats.timetableId }}</b>
              </router-link>
            </template>
            <template #author>
-              <router-link :to="`/journal/dispatchers?dispatcherName=${data.stats.timetableAuthor}`">
+              <router-link :to="`/journal/dispatchers?dispatcherName=${stats.timetableAuthor}`">
-                <b>{{ data.stats.timetableAuthor }}</b>
+                <b>{{ stats.timetableAuthor }}</b>
              </router-link>
            </template>
            <template #driver>
-              <b>{{ data.stats.timetableDriver }}</b>
+              <b class="text--primary">{{ stats.timetableDriver }}</b>
            </template>
            <template #distance>
-              <b class="text--primary">{{ data.stats.timetableRouteDistance }} km</b>
+              <b class="text--primary">{{ stats.timetableRouteDistance }} km</b>
            </template>
          </i18n-t>
        </div>
        <div v-if="firstPlaceDispatchers.length == 1">
          &bull;
-          <i18n-t keypath="journal.timetable-stats-most-active">
+          <i18n-t keypath="journal.timetable-stats-most-active-dr">
            <template #dispatcher>
              <router-link :to="`/journal/dispatchers?dispatcherName=${firstPlaceDispatchers[0].name}`">
                <b>{{ firstPlaceDispatchers[0].name }}</b>
@@ -67,7 +73,7 @@
        <div v-if="firstPlaceDispatchers.length > 1">
          &bull;
-          <i18n-t keypath="journal.timetable-stats-most-active-many">
+          <i18n-t keypath="journal.timetable-stats-most-active-dr-many">
            <template #dispatchers>
              <span v-for="(disp, i) in firstPlaceDispatchers">
                <span v-if="i == firstPlaceDispatchers.length - 1"> {{ $t('general.and') }} </span>
@@ -88,22 +94,57 @@
            </template>
          </i18n-t>
        </div>
        <div v-if="stats.longestDuties.length > 0">
          &bull;
          <i18n-t keypath="journal.timetable-stats-longest-duties">
            <template #dispatcher>
              <router-link :to="`/journal/dispatchers?dispatcherName=${stats.longestDuties[0].name}`">
                <b>{{ stats.longestDuties[0].name }}</b>
              </router-link>
            </template>
            <template #station>{{ stats.longestDuties[0].station }}</template>
            <template #duration>
              {{ calculateDuration(stats.longestDuties[0].duration) }}
            </template>
          </i18n-t>
        </div>
        <div v-if="stats.mostActiveDrivers.length > 0">
          &bull;
          <i18n-t keypath="journal.timetable-stats-most-active-driver">
            <template #driver>
              <b class="text--primary">{{ stats.mostActiveDrivers[0].name }}</b>
            </template>
            <template #distance>
              <b class="text--primary">{{ stats.mostActiveDrivers[0].distance }} km</b>
            </template>
          </i18n-t>
        </div>
      </span>
    </span>
  </section>
 </template>
-<script setup lang="ts">
+<script lang="ts">
 import axios from 'axios';
-import { computed, reactive, ref } from 'vue';
+import { defineComponent } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import { DataStatus } from '../../scripts/enums/DataStatus';
 import { ITimetablesDailyStats, ITimetablesDailyStatsResponse } from '../../scripts/interfaces/api/StatsAPIData';
 import { URLs } from '../../scripts/utils/apiURLs';
-const intervalId = ref(-1);
+export default defineComponent({
  mixins: [dateMixin],
  emits: ['toggleStatsOpen'],
-const data = reactive({
+  data() {
    return {
      DataStatus,
      statsStatus: DataStatus.Loading,
      intervalId: -1,
      stats: {
        totalTimetables: 0,
@@ -113,70 +154,97 @@ const data = reactive({
        timetableDriver: '',
        timetableId: 0,
        timetableRouteDistance: 0,
-
+        longestDuties: [],
        mostActiveDrivers: [],
        mostActiveDispatchers: [],
      } as ITimetablesDailyStats,
-});
+    };
  },
-const firstPlaceDispatchers = computed(() => {
+  activated() {
-  if (data.stats.mostActiveDispatchers.length == 0) return [];
+    this.startFetchingDailyStats();
-  const maxCount = data.stats.mostActiveDispatchers[0].count;
+    this.$emit('toggleStatsOpen', true);
  },
-  return data.stats.mostActiveDispatchers.filter((disp) => disp.count === maxCount);
+  deactivated() {
-});
+    this.stopFetchingDailyStats();
  },
-async function fetchDailyTimetableStats() {
+  computed: {
    firstPlaceDispatchers() {
      if (this.stats.mostActiveDispatchers.length == 0) return [];
      const maxCount = this.stats.mostActiveDispatchers[0].count;
      return this.stats.mostActiveDispatchers.filter((disp) => disp.count === maxCount);
    },
  },
  methods: {
    async fetchDailyTimetableStats() {
      try {
-    const {
+        const res: ITimetablesDailyStatsResponse = await (
      distanceAvg,
      distanceSum,
      maxTimetable,
      totalTimetables,
      mostActiveDispatchers,
    }: ITimetablesDailyStatsResponse = await (
          await axios.get(`${URLs.stacjownikAPI}/api/getDailyTimetableStats`)
        ).data;
-    data.stats = {
+        this.stats = {
-      totalTimetables,
+          totalTimetables: res.totalTimetables,
-      distanceSum,
+          distanceSum: res.distanceSum,
-      distanceAvg,
+          distanceAvg: res.distanceAvg,
-      timetableAuthor: maxTimetable?.authorName || '',
+          timetableAuthor: res.maxTimetable?.authorName || '',
-      timetableDriver: maxTimetable?.driverName || '',
+          timetableDriver: res.maxTimetable?.driverName || '',
-      timetableId: maxTimetable?.id || 0,
+          timetableId: res.maxTimetable?.id || 0,
-      timetableRouteDistance: maxTimetable?.routeDistance || 0,
+          timetableRouteDistance: res.maxTimetable?.routeDistance || 0,
-      mostActiveDispatchers,
+          mostActiveDispatchers: res.mostActiveDispatchers,
          mostActiveDrivers: res.mostActiveDrivers,
          longestDuties: res.longestDuties,
        };
-    data.statsStatus = DataStatus.Loaded;
+        this.statsStatus = DataStatus.Loaded;
      } catch (error) {
        console.error('Ups! Wystąpił błąd podczas pobierania statystyk rozkładów jazdy...');
-    data.statsStatus = DataStatus.Error;
+        this.statsStatus = DataStatus.Error;
  }
      }
    },
-function startFetchingDailyStats() {
+    startFetchingDailyStats() {
-  fetchDailyTimetableStats();
+      this.fetchDailyTimetableStats();
  intervalId.value = setInterval(fetchDailyTimetableStats, 60000);
 }
-function stopFetchingDailyStats() {
+      if (this.intervalId != -1) return;
  clearInterval(intervalId.value);
 }
-defineExpose({
+      this.intervalId = setInterval(this.fetchDailyTimetableStats, 60000);
-  startFetchingDailyStats,
+    },
-  stopFetchingDailyStats,
+
    stopFetchingDailyStats() {
      clearInterval(this.intervalId);
      this.intervalId = -1;
    },
  },
 });
 </script>
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
 .daily-stats {
  text-align: left;
 }
 .daily-stats > span[data-active='0'] {
  opacity: 0.75;
 }
 .stats-list a {
  text-decoration: underline;
 }
@include smallScreen {
  .daily-stats {
    text-align: justify;
  }
  h3 {
    text-align: center;
  }
 }
 </style>
@@ -17,10 +17,10 @@
        @keydown.enter="navigateToScenery(item.stationName, item.isOnline)"
        tabindex="0"
      >
-        <span>
+        <span class="item-general">
          <b
            v-if="item.dispatcherLevel !== null"
-            class="dispatcher-level"
+            class="level-badge dispatcher"
            :style="calculateExpStyle(item.dispatcherLevel, item.dispatcherIsSupporter)"
          >
            {{ item.dispatcherLevel >= 2 ? item.dispatcherLevel : 'L' }}
@@ -29,9 +29,13 @@
          <b class="text--primary">{{ item.dispatcherName }}</b> &bull; <b>{{ item.stationName }}</b>
          <span class="text--grayed">&nbsp;#{{ item.stationHash }}&nbsp;</span>
          <span class="region-badge" :class="item.region">PL1</span>
          <span class="like-count" v-if="item.dispatcherRate">
            <img :src="getIcon('like')" alt="like icon" />
            {{ item.dispatcherRate }}
          </span>
        </span>
-        <span>
+        <span class="item-time">
          <span :data-status="item.isOnline"> {{ item.isOnline ? $t('journal.online-since') : 'OFFLINE' }}&nbsp; </span>
          <span>
            {{ new Date(item.timestampFrom).toLocaleTimeString('pl-PL', { timeStyle: 'short' }) }}
@@ -55,6 +59,7 @@ import { defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIData';
 import styleMixin from '../../mixins/styleMixin';
 import imageMixin from '../../mixins/imageMixin';
 export default defineComponent({
  props: {
@@ -64,7 +69,7 @@ export default defineComponent({
    },
  },
-  mixins: [dateMixin, styleMixin],
+  mixins: [dateMixin, styleMixin, imageMixin],
  computed: {
    computedDispatcherHistory() {
@@ -99,17 +104,9 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../../styles/animations.scss';
@import '../../styles/responsive.scss';
@import '../../styles/badge.scss';
@import '../../styles/JournalSection.scss';
-
+@import '../../styles/variables.scss';
 .region-badge {
  padding: 0.1em 0.5em;
  border-radius: 0.5em;
  font-weight: bold;
  &.eu {
    background-color: forestgreen;
  }
 }
 li.sticky {
  position: sticky;
@@ -123,7 +120,7 @@ li.sticky {
  flex-wrap: wrap;
  text-align: left;
-  gap: 0.25em;
+  gap: 0.5em 1em;
  line-height: 1.7em;
  padding: 0.75em;
@@ -141,6 +138,18 @@ li.sticky {
  }
 }
 .item-general {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25em;
  flex-wrap: wrap;
  .level-badge {
    margin-right: 0.25em;
  }
 }
 .journal_day {
  margin-bottom: 1em;
  padding: 0.5em;
@@ -158,15 +167,17 @@ li.sticky {
  }
 }
-.dispatcher-level {
+.like-count {
-  display: inline-block;
+  display: flex;
-  text-align: center;
+  align-items: center;
  gap: 0.25em;
  font-size: 1.2em;
  color: $accentCol;
 }
-  line-height: 1.45em;
+@include smallScreen {
-  width: 1.45em;
+  .journal_item {
-  height: 1.45em;
+    flex-direction: column;
-
+  }
  margin-right: 0.45em;
  border-radius: 0.25em;
 }
 </style>
@@ -29,7 +29,7 @@
          <h1 class="option-title">{{ $t('options.search-title') }}</h1>
          <div class="search_content">
            <div class="search" v-for="(_, propName) in searchersValues" :key="propName">
-              <label v-if="propName == 'search-date'" for="date">{{ $t('options.search-date') }}</label>
+              <label v-if="propName == 'search-date'" for="date">{{ $t(`options.search-${optionsType}-date`) }}</label>
              <div class="search-box">
                <input
@@ -49,15 +49,6 @@
                </button>
              </div>
            </div>
            <div class="search_actions">
              <button class="btn--action" @click="onResetButtonClick">
                {{ $t('options.reset-button') }}
              </button>
              <button class="btn--action" @click="onSearchButtonConfirm">
                {{ $t('options.search-button') }}
              </button>
            </div>
          </div>
          <h1 class="option-title">{{ $t('options.sort-title') }}</h1>
@@ -74,17 +65,33 @@
          </div>
          <h1 class="option-title" v-if="filters.length != 0">{{ $t('options.filter-title') }}</h1>
          <div class="options_filter-sections" v-if="filters.length != 0 && filterList">
            <section class="filter-section" v-for="section in JournalFilterSection">
              <p>{{ $t(`options.filter-section-${section}`) }}</p>
              <div class="options_filters">
                <button
-              v-for="filter in filters"
+                  v-for="filter in filterList.filter((f) => f.filterSection == section)"
                  class="filter-option btn--option"
-              :class="{ checked: journalFilterActive.id === filter.id }"
+                  :class="{ checked: filter.isActive }"
                  :id="filter.id"
                  @click="onFilterChange(filter)"
                >
                  {{ $t(`options.filter-${filter.id}`) }}
                </button>
              </div>
            </section>
          </div>
          <div class="options_actions">
            <button class="btn--action" @click="onResetButtonClick">
              {{ $t('options.reset-button') }}
            </button>
            <button class="btn--action" @click="onSearchButtonConfirm">
              {{ $t('options.search-button') }}
            </button>
          </div>
        </div>
      </div>
    </transition>
@@ -100,9 +107,10 @@ import { DataStatus } from '../../scripts/enums/DataStatus';
 import { DriverStatsAPIData } from '../../scripts/interfaces/api/DriverStatsAPIData';
 import { URLs } from '../../scripts/utils/apiURLs';
 import { useStore } from '../../store/store';
 import { JournalTimetableFilter } from '../../types/Journal/JournalTimetablesTypes';
 import ActionButton from '../Global/ActionButton.vue';
 import SelectBox from '../Global/SelectBox.vue';
 import { JournalFilterSection } from '../../scripts/enums/JournalFilterType';
 import { JournalFilter } from '../../scripts/types/JournalTimetablesTypes';
 export default defineComponent({
  components: { SelectBox, ActionButton },
@@ -116,7 +124,7 @@ export default defineComponent({
    },
    filters: {
-      type: Array as PropType<JournalTimetableFilter[]>,
+      type: Array as PropType<JournalFilter[]>,
      default: [],
    },
@@ -129,11 +137,17 @@ export default defineComponent({
      type: Boolean,
      default: false,
    },
    optionsType: {
      type: String,
      required: true,
    },
  },
  data() {
    return {
      showOptions: false,
      JournalFilterSection,
      driverSuggestions: [] as string[],
      dispatcherSuggestions: [] as string[],
@@ -149,7 +163,8 @@ export default defineComponent({
    return {
      searchersValues: inject('searchersValues') as { [key: string]: string },
      sorterActive: inject('sorterActive') as { id: string | number; dir: number },
-      journalFilterActive: inject('journalFilterActive') as JournalTimetableFilter,
+      // journalFilterActive: inject('journalFilterActive') as JournalFilter,
      filterList: inject('filterList') as JournalFilter[] | undefined,
    };
  },
@@ -169,7 +184,8 @@ export default defineComponent({
  watch: {
    async driverStatsName(value: string) {
      await this.fetchDriverStats();
-      this.store.currentStatsTab = value ? 'driver' : 'daily';
+
      // if (value) this.store.currentStatsTab = 'driver';
    },
    async 'searchersValues.search-driver'(value: string | undefined) {
@@ -244,18 +260,17 @@ export default defineComponent({
      });
    },
    focusEnd() {
      console.log('focus end');
    },
    onSorterChange(item: { id: string | number; value: string }) {
      this.sorterActive.id = item.id;
      this.sorterActive.dir = -1;
      this.$emit('onSearchConfirm');
    },
-    onFilterChange(filter: JournalTimetableFilter) {
+    onFilterChange(filter: JournalFilter) {
-      this.journalFilterActive = filter;
+      // this.journalFilterActive = filter;
      this.filterList?.filter((f) => f.filterSection === filter.filterSection).forEach((f) => (f.isActive = false));
      filter.isActive = true;
      this.$emit('onSearchConfirm');
    },
@@ -1,11 +1,13 @@
 <template>
-  <div class="journal-stats" v-show="!store.isOffline">
+  <div class="journal-stats" v-if="!store.isOffline">
    <div class="tabs">
      <button
        v-for="tab in data.tabs"
        class="btn--filled"
        :data-selected="tab.name == store.currentStatsTab && areStatsOpen"
        :data-inactive="tab.inactive"
        :data-disabled="tab.inactive"
        :disabled="tab.inactive"
        @click="onTabButtonClick(tab.name)"
      >
        {{ $t(tab.titlePath) }}
@@ -14,7 +16,7 @@
    <div class="stats-tab" v-show="areStatsOpen">
      <keep-alive>
-        <JournalDailyStats v-if="store.currentStatsTab == 'daily'" ref="dailyStatsComp" />
+        <JournalDailyStats v-if="store.currentStatsTab == 'daily'" @toggleStatsOpen="toggleStatsOpen" />
        <JournalDriverStats v-else-if="store.currentStatsTab == 'driver'" />
      </keep-alive>
    </div>
@@ -22,21 +24,21 @@
 </template>
 <script setup lang="ts">
-import { computed, KeepAlive, onActivated, onDeactivated, reactive, Ref, ref, watch } from 'vue';
+import { computed, KeepAlive, onMounted, reactive, Ref, ref, watch } from 'vue';
 import { useStore } from '../../store/store';
 import JournalDailyStats from './DailyStats.vue';
 import JournalDriverStats from './JournalDriverStats.vue';
 import StorageManager from '../../scripts/managers/storageManager';
 // Types
 type TStatTab = 'daily' | 'driver';
 // Variables
 const store = useStore();
 const dailyStatsComp: Ref<InstanceType<typeof JournalDailyStats> | null> = ref(null);
-const areStatsOpen = ref(true);
+const lastDailyStatsOpen = ref(false);
-const lastClickedTab = ref('daily');
+const areStatsOpen = ref(false);
 const lastClickedTab: Ref<'daily' | 'driver' | null> = ref(null);
 let data = reactive({
  tabs: [
@@ -47,38 +49,44 @@ let data = reactive({
    {
      name: 'driver',
      titlePath: 'journal.driver-stats-title',
-      inactive: true,
+      // inactive: true,
    },
  ] as { name: TStatTab; titlePath: string; inactive?: boolean }[],
 });
 // Methods
 function onTabButtonClick(tab: TStatTab) {
-  if (lastClickedTab.value == tab || !areStatsOpen.value) {
+  if (lastClickedTab.value == tab || !areStatsOpen.value) areStatsOpen.value = !areStatsOpen.value;
-    areStatsOpen.value = !areStatsOpen.value;
+
  if (tab == 'daily') {
    StorageManager.setBooleanValue('dailyStatsOpen', areStatsOpen.value);
    lastDailyStatsOpen.value = areStatsOpen.value;
  }
  store.currentStatsTab = tab;
  lastClickedTab.value = tab;
  if (areStatsOpen.value == false) store.currentStatsTab = null;
 }
-onActivated(() => {
+function toggleStatsOpen(open: boolean) {
-  dailyStatsComp.value?.startFetchingDailyStats();
+  areStatsOpen.value = open;
-});
+}
 onDeactivated(() => {
  dailyStatsComp.value?.stopFetchingDailyStats();
 });
 watch(
  computed(() => store.driverStatsData),
  (statsData) => {
-    data.tabs[1].inactive = statsData ? false : true;
+    store.currentStatsTab = statsData ? 'driver' : lastClickedTab.value;
-
+    areStatsOpen.value = statsData ? true : lastClickedTab.value !== null;
    lastClickedTab.value = statsData ? 'driver' : 'daily';
    if (statsData) areStatsOpen.value = true;
  }
 );
 onMounted(() => {
  if (StorageManager.getBooleanValue('dailyStatsOpen')) {
    areStatsOpen.value = true;
    store.currentStatsTab = 'daily';
  }
 });
 </script>
 <style lang="scss" scoped>
@@ -1,35 +1,51 @@
 <template>
  <transition-group class="journal-list" tag="ul" name="list-anim">
    <li
-      v-for="{ timetable, sceneryList, ...item } in computedTimetableHistory"
+      v-for="{ timetable, stockHistoryComp, stops, showExtraInfo, ...item } in computedTimetableHistory"
      class="journal_item"
      :key="timetable.id"
      @click="showExtraInfo.value = !showExtraInfo.value"
    >
      <div class="journal_item-info">
-        <div class="info-top">
+        <div class="info-general">
          <span
            class="general-train"
            tabindex="0"
-            @click="showTimetable(timetable)"
+            @click.stop="showTimetable(timetable)"
            @keydown.enter="showTimetable(timetable)"
            style="cursor: pointer"
          >
            <b class="text--primary">{{ timetable.trainCategoryCode }}&nbsp;</b>
            <b>{{ timetable.trainNo }}</b>
            | <span>{{ timetable.driverName }}</span> |
            <span class="text--grayed">#{{ timetable.id }}</span>
-            <span v-if="timetable.driverLevel !== null">
+
-              |
+            <span class="badges" v-if="timetable.skr || timetable.twr">
-              <b :style="calculateTextExpStyle(timetable.driverLevel, timetable.driverIsSupporter)">
+              <span class="train-badge twr" v-if="timetable.twr" :title="$t('general.TWR')">TWR</span>
-                {{ timetable.driverLevel < 2 ? 'L' : `${timetable.driverLevel} lvl` }}
+              <span class="train-badge skr" v-if="timetable.skr" :title="$t('general.SKR')">SKR</span>
              </b>
            </span>
            </span>
            <span>
              <strong class="text--primary">
                {{ timetable.trainCategoryCode }}
              </strong>
              <strong>&nbsp;{{ timetable.trainNo }}</strong>
            </span>
            &bull;
            <strong
              v-if="timetable.driverLevel !== null"
              class="level-badge driver"
              :style="calculateExpStyle(timetable.driverLevel, timetable.driverIsSupporter)"
            >
              {{ timetable.driverLevel < 2 ? 'L' : `${timetable.driverLevel}` }}
            </strong>
            <strong>{{ timetable.driverName }}</strong>
          </span>
          <span class="general-time">
            <b class="info-date">{{ localeDay(timetable.beginDate, $i18n.locale) }}</b>
            <b
-              class="info-status"
+              class="info-badge"
              :class="{
-                fulfilled: timetable.fulfilled || timetable.currentDistance >= timetable.routeDistance * 0.9,
+                fulfilled: timetable.fulfilled,
                terminated: timetable.terminated && !timetable.fulfilled,
                active: !timetable.terminated,
              }"
@@ -37,29 +53,42 @@
              {{
                !timetable.terminated
                  ? $t('journal.timetable-active')
-                  : timetable.fulfilled || timetable.currentDistance >= timetable.routeDistance * 0.9
+                  : timetable.fulfilled
                  ? $t('journal.timetable-fulfilled')
                  : `${$t('journal.timetable-abandoned')} ${localeTime(timetable.endDate, $i18n.locale)}`
              }}
            </b>
          </span>
        </div>
        <div class="info-route">
          <b>{{ timetable.route.replace('|', ' - ') }}</b>
        </div>
        <hr />
-        <div class="scenery-list">
+
-          <span v-for="(scenery, i) in sceneryList" :key="scenery.name" :class="{ confirmed: scenery.confirmed }">
+        <!-- Spis postojów -->
-            <span v-if="i > 0"> &gt;</span>
+        <div class="stop-list">
-            {{ scenery.name }}
+          <span
-            <!-- Data odjazdu ze stacji początkowej -->
+            v-for="(stop, i) in stops.filter((_, i) => (!showExtraInfo.value ? i == 0 || i == stops.length - 1 : true))"
-            <span v-if="i == 0" v-html="scenery.beginDateHTML"></span>
+            class="stop-list-item"
-            <!-- Data przyjazdu do stacji końcowej -->
+            :key="stop.stopName"
-            <span v-if="i == sceneryList.length - 1" v-html="scenery.endDateHTML"> </span>
+            :data-confirmed="stop.confirmed"
          >
            <span v-if="i > 0">
              &gt;
              <span v-if="!showExtraInfo.value && i == 1 && stops.length > 2">
                ... (+{{ stops.length - 2 }}) &gt;
              </span>
            </span>
            <span class="stop-name">{{ stop.stopName }}</span>
            <span v-html="stop.html"></span>
          </span>
        </div>
        <!-- Status RJ -->
-        <div style="margin: 0.5em 0">
+        <div class="info-status" style="margin: 0.5em 0">
          <span>
            <b>{{ $t('journal.route-length') }}</b>
            {{ !timetable.fulfilled ? timetable.currentDistance + ' /' : '' }}
@@ -76,42 +105,96 @@
            <b>
              {{ $t(`journal.${timetable.terminated ? 'last-seen-at' : 'currently-at'}`) }}
              {{ timetable.currentSceneryName.replace(/.[a-zA-Z0-9]+.sc/, '') }}
              <span v-if="timetable.currentLocation[0] || timetable.currentLocation[1]">&lpar;</span>
              <span v-if="timetable.currentLocation[1]">
                {{ $t('journal.timetable-location-route') }} {{ timetable.currentLocation[1] }}
              </span>
              <span v-else-if="timetable.currentLocation[0]">
                {{ $t('journal.timetable-location-signal') }} {{ timetable.currentLocation[0] }}
              </span>
              <span v-if="timetable.currentLocation[0] || timetable.currentLocation[1]">&rpar;</span>
            </b>
          </span>
        </div>
-        <!-- Nick dyżurnego -->
+
-        <div v-if="timetable.authorName">
+        <!-- Info o autorze RJ -->
        <div class="info-author" v-if="timetable.authorName">
          <b class="text--grayed">{{ $t('journal.dispatcher-name') }}&nbsp;</b>
          <router-link class="dispatcher-link" :to="`/journal/dispatchers?dispatcherName=${timetable.authorName}`">
            <b>{{ timetable.authorName }}</b>
          </router-link>
          <span class="text--grayed">
            ({{
              (new Date(timetable.createdAt).getTime() - new Date(timetable.beginDate).getTime() < 0
                ? new Date(timetable.createdAt)
                : new Date(timetable.beginDate)
              ).toLocaleString($i18n.locale, { timeStyle: 'short', dateStyle: 'full' })
            }})
          </span>
        </div>
-        <button
+
-          v-if="timetable.stockString"
+        <button class="btn--option btn--show">
          class="btn--option btn--show"
          @click="item.showStock.value = !item.showStock.value"
        >
          {{ $t('journal.stock-info') }}
-          <img :src="getIcon(`arrow-${item.showStock.value ? 'asc' : 'desc'}`)" alt="Arrow" />
+          <img :src="getIcon(`arrow-${showExtraInfo.value ? 'asc' : 'desc'}`)" alt="Arrow" />
        </button>
-        <div class="info-extended" v-if="timetable.stockString && item.showStock.value">
+
        <!-- Dodatkowe informacje -->
        <div class="info-extended" v-if="timetable.stockString && timetable.stockMass && showExtraInfo.value">
          <hr />
-          <div>
+
-            <span class="badge info-badge">
+          <div class="stock-specs">
            <span class="badge specs-badge">
              <span>{{ $t('journal.stock-max-speed') }}</span>
              <span>{{ timetable.maxSpeed }}km/h</span>
            </span>
-            <span class="badge info-badge">
+            <span class="badge specs-badge">
              <span>{{ $t('journal.stock-length') }}</span>
-              <span>{{ timetable.stockLength }}m</span>
+              <span>
                {{
                  item.currentHistoryIndex.value == 0
                    ? timetable.stockLength
                    : stockHistoryComp[item.currentHistoryIndex.value].stockLength || timetable.stockLength
                }}m
              </span>
-            <span class="badge info-badge">
+            </span>
            <span class="badge specs-badge">
              <span>{{ $t('journal.stock-mass') }}</span>
-              <span>{{ Math.floor(timetable.stockMass! / 1000) }}t</span>
+              <span>
                {{
                  Math.floor(
                    (item.currentHistoryIndex.value == 0
                      ? timetable.stockMass!
                      : stockHistoryComp[item.currentHistoryIndex.value].stockMass || timetable.stockMass) / 1000
                  )
                }}t
              </span>
            </span>
          </div>
          <!-- Historia zmian w składzie -->
          <div class="stock-history" v-if="stockHistoryComp.length > 1">
            <button
              class="btn--action"
              v-for="(sh, i) in stockHistoryComp"
              :data-checked="i == item.currentHistoryIndex.value"
              @click.stop="item.currentHistoryIndex.value = i"
            >
              {{ sh.updatedAt }}
            </button>
          </div>
          <ul class="stock-list">
-            <li v-for="(car, i) in timetable.stockString.split(';')" :key="i">
+            <li
              v-for="(car, i) in (item.currentHistoryIndex.value == 0
                ? timetable.stockString
                : stockHistoryComp[item.currentHistoryIndex.value].stockString
              ).split(';')"
              :key="i"
            >
              <img
                @error="onImageError"
                :src="`https://rj.td2.info.pl/dist/img/thumbnails/${car.split(':')[0]}.png`"
@@ -148,47 +231,85 @@ export default defineComponent({
    computedTimetableHistory() {
      return this.timetableHistory.map((timetable) => ({
        timetable,
-        sceneryList: this.getSceneryList(timetable),
+        stockHistoryComp: timetable.stockHistory
-        showStock: ref(false),
+          .slice()
          .reverse()
          .map((h) => {
            const historyData = h.split('@');
            return {
              updatedAt: new Date(Number(historyData[0])).toLocaleTimeString(this.$i18n.locale, {
                hour: '2-digit',
                minute: '2-digit',
              }),
              stockString: historyData[1],
              stockMass: Number(historyData[2]) || undefined,
              stockLength: Number(historyData[3]) || undefined,
            };
          }),
        showExtraInfo: ref(false),
        stops: this.getTimetableStops(timetable),
        currentHistoryIndex: ref(0),
      }));
    },
  },
  methods: {
-    getSceneryList(timetable: TimetableHistory) {
+    getTimetableStops(timetable: TimetableHistory) {
-      return timetable.sceneriesString.split('%').map((name, i) => {
+      const stopNames = timetable.sceneriesString.split('%');
        const beginDateHTML =
          ' (o. ' +
          (timetable.beginDate != timetable.scheduledBeginDate
            ? `<s class='text--grayed'>${this.localeTime(timetable.beginDate, this.$i18n.locale)}</s> `
            : '') +
          `<span>${this.localeTime(timetable.scheduledBeginDate, this.$i18n.locale)}</span>)`;
-        const endDateHTML =
+      const beginDateHTML = ` (o. ${
-          ' (p. ' +
+        timetable.beginDate != timetable.scheduledBeginDate
-          (timetable.endDate != timetable.scheduledEndDate && timetable.fulfilled
+          ? `<s class="text--grayed">${this.localeTime(timetable.beginDate, this.$i18n.locale)}</s>`
-            ? `<s class='text--grayed'>${this.localeTime(
+          : ''
-                timetable.fulfilled ? timetable.endDate : timetable.scheduledEndDate,
+      } <span>${this.localeTime(timetable.scheduledBeginDate, this.$i18n.locale)}</span>)`;
                this.$i18n.locale
              )}</s> `
            : '') +
          `<span>${this.localeTime(
            timetable.fulfilled || (timetable.terminated && !timetable.fulfilled)
              ? timetable.scheduledEndDate
              : timetable.endDate,
            this.$i18n.locale
          )}</span>)`;
-        const abandonedDateHTML = ` (porz. ${this.localeTime(
+      const endDateHTML = ` (p. ${
-          timetable.fulfilled ? timetable.scheduledEndDate : timetable.endDate,
+        timetable.endDate != timetable.scheduledEndDate && timetable.fulfilled
-          this.$i18n.locale
+          ? `<s class="text--grayed">${this.localeTime(timetable.endDate, this.$i18n.locale)}</s>`
-        )})`;
+          : ''
      } <span>${this.localeTime(timetable.scheduledEndDate, this.$i18n.locale)}</span>)`;
-        return { name, confirmed: i < timetable.confirmedStopsCount, beginDateHTML, endDateHTML, abandonedDateHTML };
+      return stopNames.map((stopName, i) => {
        const confirmed = i < timetable.confirmedStopsCount;
        if (i == 0) return { stopName, html: beginDateHTML, confirmed };
        if (i == stopNames.length - 1) return { stopName, html: endDateHTML, confirmed };
        const departureDateScheduled = this.stringToDate(timetable.checkpointDeparturesScheduled?.at(i));
        const departureDateReal = this.stringToDate(timetable.checkpointDepartures?.at(i));
        const arrivalDateScheduled = this.stringToDate(timetable.checkpointArrivalsScheduled?.at(i));
        const arrivalDateReal = this.stringToDate(timetable.checkpointArrivals?.at(i));
        // const arrivalDelay =
        //   arrivalDateReal && arrivalDateScheduled ? arrivalDateReal.getTime() - arrivalDateScheduled.getTime() : 0;
        // const departureDelay =
        //   departureDateReal && departureDateScheduled
        //     ? departureDateReal.getTime() - departureDateScheduled.getTime()
        //     : 0;
        const arrivalHTML =
          (arrivalDateReal && arrivalDateScheduled && arrivalDateReal?.getTime() != arrivalDateScheduled?.getTime()
            ? `<s class="text--grayed">${this.parseDateToTimeString(arrivalDateScheduled)}</s> `
            : '') + this.parseDateToTimeString(arrivalDateReal || arrivalDateScheduled);
        const departureHTML =
          (departureDateReal &&
          departureDateScheduled &&
          departureDateReal?.getTime() != departureDateScheduled?.getTime()
            ? `<s class="text--grayed">${this.parseDateToTimeString(departureDateScheduled)}</s> `
            : '') + this.parseDateToTimeString(departureDateReal || departureDateScheduled);
        let html = `${arrivalHTML}${departureHTML ? ` / ${departureHTML}` : ''}`;
        if (html) html = ` (${html})`;
        return { stopName, html, confirmed };
      });
    },
    showTimetable(timetable: TimetableHistory) {
      if (!timetable) return;
      if (timetable.terminated) return;
      this.selectModalTrain(timetable.driverName + timetable.trainNo.toString());
@@ -209,6 +330,9 @@ export default defineComponent({
@import '../../styles/badge.scss';
@import '../../styles/JournalSection.scss';
 .journal_item {
  cursor: pointer;
 }
 hr {
  margin: 0.25em 0;
@@ -219,7 +343,7 @@ hr {
    margin-right: 0.5em;
  }
-  &-status {
+  &-badge {
    padding: 0.05em 0.35em;
    color: black;
@@ -236,10 +360,14 @@ hr {
    }
  }
-  &-top {
+  &-general {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: 0.5em;
  }
  &-route {
@@ -251,6 +379,13 @@ hr {
  }
 }
 .general-train {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25em;
 }
 ul.stock-list {
  display: flex;
  align-items: flex-end;
@@ -263,12 +398,60 @@ ul.stock-list {
    color: #aaa;
    font-size: 0.9em;
  }
  li > img {
    vertical-align: text-bottom;
    max-height: 60px;
  }
 }
-.scenery-list {
+.stock-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  margin-top: 0.5em;
  .specs-badge {
    margin: 0;
    span:last-child {
      color: black;
      background-color: $accentCol;
    }
  }
 }
 .badges {
  display: flex;
  gap: 0.25em;
  // badge.scss
 }
 .stock-history {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  margin-top: 1em;
  button[data-checked='true'] {
    color: $accentCol;
  }
 }
 .stop-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25em;
  color: #adadad;
-  span.confirmed {
+
  &-item[data-confirmed='true'] {
    color: #a3eba3;
    .stop-name {
      font-weight: bold;
    }
  }
 }
@@ -283,23 +466,8 @@ ul.stock-list {
  }
 }
 .info-badge {
  span:last-child {
    color: black;
    background-color: $accentCol;
  }
 }
@include smallScreen {
-  .info-top {
+  .journal_item-info {
    flex-direction: column;
    span {
      margin: 0.1em auto;
    }
  }
  .info-extended {
    text-align: center;
  }
@@ -311,5 +479,12 @@ ul.stock-list {
  .btn--show {
    margin: 1em auto 0 auto;
  }
  .info-general,
  .general-train,
  .stock-specs,
  .stock-history {
    justify-content: center;
  }
 }
 </style>
@@ -2,17 +2,43 @@
  <section class="scenery-dispatchers-history scenery-section">
    <Loading v-if="dataStatus != 2" />
-    <div class="list-warning" v-else-if="dispatcherHistoryList.length == 0">{{ $t('scenery.history-list-empty') }}</div>
+    <table class="scenery-history-table" v-else-if="historyList.length">
      <thead>
        <!-- <th>{{ $t('scenery.timetables-history-id') }}</th>
        <th>{{ $t('scenery.timetables-history-number') }}</th>
        <th>{{ $t('scenery.timetables-history-route') }}</th>
        <th>{{ $t('scenery.timetables-history-driver') }}</th>
        <th>{{ $t('scenery.timetables-history-author') }}</th>
        <th>{{ $t('scenery.timetables-history-date') }}</th> -->
-    <ul class="history-list" v-else>
+        <th>Hash</th>
-      <li class="list-item" v-for="historyItem in dispatcherHistoryList">
+        <th>Dyżurny</th>
-        <div>
+        <th>Poziom</th>
        <th>Ocena</th>
        <th>Data</th>
      </thead>
      <tbody>
        <tr v-for="historyItem in historyList">
          <td>#{{ historyItem.stationHash }}</td>
          <td>
            <router-link :to="`/journal/dispatchers?dispatcherName=${historyItem.dispatcherName}`">
            <span class="text--grayed">#{{ historyItem.stationHash }}&nbsp;</span>
              <b>{{ historyItem.dispatcherName }}</b>
            </router-link>
-        </div>
+          </td>
-
+          <td>
            <b
              v-if="historyItem.dispatcherLevel !== null"
              class="level-badge dispatcher"
              :style="calculateExpStyle(historyItem.dispatcherLevel, historyItem.dispatcherIsSupporter)"
            >
              {{ historyItem.dispatcherLevel >= 2 ? historyItem.dispatcherLevel : 'L' }}
            </b>
          </td>
          <td class="text--primary">
            <b>{{ historyItem.dispatcherRate }}</b>
          </td>
          <td style="min-width: 300px">
            <div v-if="historyItem.timestampTo">
              <b>{{ $d(historyItem.timestampFrom) }}</b>
@@ -25,8 +51,13 @@
              <b>{{ timestampToString(historyItem.timestampFrom) }}</b>
              ({{ calculateDuration(historyItem.currentDuration) }})
            </div>
-      </li>
+          </td>
-    </ul>
+        </tr>
      </tbody>
    </table>
    <div class="no-history" v-else>{{ $t('scenery.history-list-empty') }}</div>
    <div ref="bottomDiv"></div>
  </section>
 </template>
@@ -39,24 +70,36 @@ import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIDa
 import Station from '../../scripts/interfaces/Station';
 import { URLs } from '../../scripts/utils/apiURLs';
 import Loading from '../Global/Loading.vue';
 import styleMixin from '../../mixins/styleMixin';
 import listObserverMixin from '../../mixins/listObserverMixin';
 export default defineComponent({
  name: 'SceneryDispatchersHistory',
-  mixins: [dateMixin],
+  mixins: [dateMixin, styleMixin, listObserverMixin],
  props: {
    station: {
      type: Object as PropType<Station>,
      required: true,
    },
  },
  data() {
    return {
-      dispatcherHistoryList: [] as DispatcherHistory[],
+      historyList: [] as DispatcherHistory[],
      dataStatus: DataStatus.Loading,
    };
  },
  mounted() {
-    this.fetchAPIData();
+    this.mountObserver(this.fireObserverAction, this.$refs['bottomDiv'] as Element);
  },
  unmounted() {
    this.unmountObserver();
  },
  activated() {
    if (this.historyList.length == 0) this.fetchAPIData();
  },
  methods: {
    async fetchAPIData(countFrom = 0, countLimit = 30) {
@@ -64,12 +107,17 @@ export default defineComponent({
        const requestString = `${URLs.stacjownikAPI}/api/getDispatchers?stationName=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
        const historyAPIData: DispatcherHistory[] = await (await axios.get(requestString)).data;
-        this.dispatcherHistoryList = historyAPIData;
+        this.historyList.push(...historyAPIData);
        this.dataStatus = DataStatus.Loaded;
      } catch (error) {
        console.error(error);
      }
    },
    fireObserverAction() {
      if (this.historyList.length > 0 && this.dataStatus == DataStatus.Loaded)
        this.fetchAPIData(this.historyList.length);
    },
  },
  components: { Loading },
 });
@@ -77,23 +125,10 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
-@import '../../styles/SceneryView/styles.scss';
+@import '../../styles/sceneryViewTables.scss';
-.history-list {
+.level-badge {
-  padding: 0 0.5em;
+  margin: 0 auto;
 }
 .list-item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: left;
  background-color: #353535;
  padding: 0.5em;
  margin: 0.5em 0;
  line-height: 1.5em;
 }
 .dispatcher-online {
@@ -1,9 +1,11 @@
 <template>
  <section class="info-header">
-    <a class="scenery-name" :href="station.generalInfo?.url">
+    <a class="scenery-name" :href="station.generalInfo?.url" target="_blank">
      {{ station.name }}
    </a>
    <div class="scenery-abbrev">{{ $t('scenery.abbrev') }} <b>{{ station.generalInfo?.abbr }}</b></div>
    <div class="scenery-hash" v-if="station.onlineInfo?.hash">#{{ station.onlineInfo.hash }}</div>
  </section>
 </template>
@@ -28,16 +30,20 @@ export default defineComponent({
 .scenery-name {
  font-weight: bold;
  position: relative;
  font-size: 3em;
  text-transform: uppercase;
 }
 .scenery-abbrev {
  font-size: 1.3em;
  color: #aaa;
 }
 .scenery-hash {
  margin-top: 0.5em;
  color: #aaa;
  font-size: 1.2em;
 }
 </style>
@@ -1,10 +1,10 @@
 <template>
  <div class="scenery-info">
    <section v-if="!timetableOnly">
-      <div class="info-general" v-if="station.generalInfo">
+      <div class="scenery-info-general" v-if="station.generalInfo">
        <scenery-info-icons :station="station" />
-        <div class="general-list">
+        <div class="scenery-general-list">
          <span>
            <b>{{ $t('availability.title') }}:</b> {{ $t(`availability.${station.generalInfo.availability}`) }}
@@ -26,26 +26,33 @@
          </span>
          <span v-if="station.generalInfo.project">
            &bull; <b>{{ $t('scenery.project-title') }}: </b>
-            <b style="color: salmon">{{ station.generalInfo.project }}</b>
+            <a
              style="color: salmon; text-decoration: underline; font-weight: bold"
              :href="station.generalInfo.projectUrl"
              target="_blank"
            >
              {{ station.generalInfo.project }}
            </a>
          </span>
        </div>
        <scenery-info-routes :station="station" />
        <div class="scenery-authors" v-if="station.generalInfo.authors && station.generalInfo.authors.length > 0">
-          <b> {{ $t('scenery.authors-title', { authors: station.generalInfo.authors.length }, station.generalInfo.authors.length) }}: </b>
+          <b>
            {{
              $t(
                'scenery.authors-title',
                { authors: station.generalInfo.authors.length },
                station.generalInfo.authors.length
              )
            }}:
          </b>
          {{ station.generalInfo.authors.join(', ') }}
        </div>
        <br />
        <div class="scenery-topic" v-if="station.generalInfo.url">
          <a :href="station.generalInfo.url" target="_blank">
            &gt; {{ $t('scenery.forum-topic', { name: station.name }) }} &lt;
          </a>
        </div>
      </div>
-      <div style="margin: 2em 0; height: 2px; background-color: white" />
+      <div style="margin: 2em 0; height: 2px; background-color: white"></div>
      <!-- info dispatcher -->
      <scenery-info-dispatcher :station="station" :onlineFrom="onlineFrom" />
@@ -124,11 +131,11 @@ h3.section-header {
  margin-top: 1em;
 }
-.info-general {
+.scenery-info-general {
  margin-top: 1em;
 }
-.general-list {
+.scenery-general-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
@@ -4,12 +4,12 @@
      <b>{{ $t('scenery.one-way-routes') }}</b>
      <ul class="routes-list">
-        <li
+        <li v-for="route in station.generalInfo.routes.oneWay" @click="setActiveShowLength(route.name)">
-          v-for="route in station.generalInfo.routes.oneWay"
+          <span :class="{ 'no-catenary': !route.catenary, internal: route.isInternal }"> {{ route.name }}</span>
-          :class="{ 'no-catenary': !route.catenary, internal: route.isInternal }"
+          <span v-if="route.speed" class="speed">
-        >
+            {{ activeShowLength.includes(route.name) ? route.length + 'm' : route.speed }}
-          {{ route.name }}
+          </span>
-          <b v-if="route.SBL">SBL</b>
+          <span v-if="route.SBL" class="sbl">SBL</span>
        </li>
      </ul>
    </div>
@@ -18,41 +18,15 @@
      <b>{{ $t('scenery.two-way-routes') }}</b>
      <ul class="routes-list">
-        <li
+        <li v-for="(route, i) in station.generalInfo.routes.twoWay" @click="setActiveShowLength(route.name)">
-          v-for="route in station.generalInfo.routes.twoWay"
+          <span :class="{ 'no-catenary': !route.catenary, internal: route.isInternal }">{{ route.name }}</span>
-          :class="{ 'no-catenary': !route.catenary, internal: route.isInternal }"
+          <span v-if="route.speed" class="speed">
-        >
+            {{ activeShowLength.includes(route.name) ? route.length + 'm' : route.speed }}
-          {{ route.name }} <b v-if="route.SBL">SBL</b>
+          </span>
          <span v-if="route.SBL" class="sbl">SBL</span>
        </li>
      </ul>
    </div>
    <!-- <div
      class="route-info"
      :class="{ 'no-catenary': !route.catenary, internal: route.isInternal }"
      v-for="route in [...station.generalInfo.routes.oneWay, ...station.generalInfo.routes.twoWay].filter(
        (route) => route.name != '-'
      )"
      :key="route.name"
      :title="`Szlak ${route.name}: ${route.isInternal ? 'wewnętrzny' : 'zewnętrzny'}, ${
        route.tracks == 2 ? 'dwutorowy' : 'jednotorowy'
      }, ${route.catenary ? 'zelektryfikowany' : 'niezelektryfikowany'} z ${route.SBL ? 'SBL' : 'PBL'} ${
        route.TWB ? 'i blokadą dwukierunkową' : ''
      }`"
    > -->
    <!-- <span class="track-name">
        <b>{{ route.name }}</b>
      </span> -->
    <!--
      <span class="track-specs">
        {{ route.tracks }}tor
        <img v-if="route.catenary" :src="icons.trackCatenary" alt="icon track catenary" />
        <img v-else :src="icons.trackNoCatenary" alt="icon track no catenary" />
        <img v-if="route.TWB" :src="icons.trackTWB" alt="icon track twb" />
        <img v-if="route.SBL" :src="icons.trackSBL" alt="icon track sbl" />
      </span> -->
    <!-- </div> -->
  </section>
 </template>
@@ -67,6 +41,19 @@ export default defineComponent({
      default: {},
    },
  },
  methods: {
    setActiveShowLength(name: string) {
      if (this.activeShowLength.includes(name)) this.activeShowLength.splice(this.activeShowLength.indexOf(name), 1);
      else this.activeShowLength.push(name);
    },
  },
  data() {
    return {
      activeShowLength: [] as string[],
    };
  },
 });
 </script>
@@ -91,12 +78,21 @@ export default defineComponent({
 ul.routes-list {
  margin: 0.45em 0.25em;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  li {
-    background-color: #007599;
+    margin: 0.5em 0.25em;
    cursor: pointer;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    span {
      padding: 0.2em 0.25em;
-    margin-left: 0.25em;
+      background-color: #007599;
      font-weight: bold;
      &.no-catenary {
        background-color: #686868;
@@ -106,8 +102,27 @@ ul.routes-list {
        text-decoration: underline;
      }
-    b {
+      &.speed {
        background-color: #404040;
        color: #cfcfcf;
      }
      &.sbl {
        color: var(--clr-primary);
        background-color: #404040;
      }
      &:last-child {
        border-radius: 0 0.5em 0.5em 0;
      }
      &:first-child {
        border-radius: 0.5em 0 0 0.5em;
      }
      &:only-child {
        border-radius: 0.5em;
      }
    }
  }
 }
@@ -9,8 +9,9 @@
    <span v-if="station.onlineInfo">
      <span
        class="badge spawn"
-        v-for="(spawn, i) in station.onlineInfo.spawns"
+        v-for="(spawn, i) in sortedSpawns"
        :key="spawn.spawnName + station.onlineInfo?.dispatcherName + i"
        :data-electrified="spawn.isElectrified"
      >
        <span class="spawn_name">{{ spawn.spawnName }}</span>
        <span class="spawn_length">{{ spawn.spawnLength }}m</span>
@@ -37,6 +38,12 @@ export default defineComponent({
      default: {},
    },
  },
  computed: {
    sortedSpawns() {
      return this.station.onlineInfo?.spawns.sort((s1, s2) => (s1.spawnLength < s2.spawnLength ? 1 : -1));
    },
  },
 });
 </script>
@@ -44,9 +51,15 @@ export default defineComponent({
@import '../../../styles/variables.scss';
 .spawn {
  color: white;
  &_length {
-    background: $accentCol;
+    background-color: #404040;
-    color: black;
+    color: #cfcfcf;
  }
  &[data-electrified='true'] > &_name {
    background-color: #007599;
  }
 }
 </style>
@@ -2,17 +2,37 @@
  <section class="scenery-timetable">
    <div class="timetable-header">
      <h3>
-        <img :src="getIcon('timetable')" alt="icon-timetable" />&nbsp;
+        <img :src="getIcon('timetable')" alt="icon-timetable" />
        <span>{{ $t('scenery.timetables') }}</span>
-        &nbsp;
+
        <span>
          <span class="text--primary">{{ station.onlineInfo?.scheduledTrains?.length || '0' }}</span>
-        <span>&nbsp;/&nbsp;</span>
+          <span> / </span>
          <span class="text--grayed">
            {{ station.onlineInfo?.scheduledTrains?.filter((train) => train.stopInfo.confirmed).length || '0' }}
          </span>
        </span>
        <span class="header_links">
          <a
            :href="`https://pragotron-td2.web.app/board?name=${station.name}`"
            target="_blank"
            :title="$t('scenery.pragotron-link')"
          >
            <img :src="getIcon('pragotron')" alt="icon-pragotron" />
          </a>
          <a
            :href="`https://tablice-td2.web.app/?station=${station.name}`"
            target="_blank"
            :title="$t('scenery.tablice-link')"
          >
            <img :src="getIcon('tablice', 'ico')" alt="icon-tablice" />
          </a>
        </span>
      </h3>
-      <div class="timetable-checkpoints" v-if="station && station.generalInfo?.checkpoints">
+      <div class="timetable-checkpoints" v-if="station?.generalInfo?.checkpoints">
        <span v-for="(cp, i) in station.generalInfo.checkpoints" :key="i">
          {{ (i > 0 && '&bull;') || '' }}
@@ -168,7 +188,6 @@ import { useStore } from '../../store/store';
 import imageMixin from '../../mixins/imageMixin';
 import modalTrainMixin from '../../mixins/modalTrainMixin';
 import ScheduledTrainStatus from './ScheduledTrainStatus.vue';
 import ScheduledTrain from '../../scripts/interfaces/ScheduledTrain';
 export default defineComponent({
  name: 'SceneryTimetable',
@@ -281,24 +300,36 @@ export default defineComponent({
 }
 .timetable-header {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: sticky;
  top: 0;
  z-index: 99;
  background-color: #181818;
  padding: 0.5em;
  img {
    width: 25px;
    vertical-align: middle;
  }
  h3 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5em;
    font-size: 1.3em;
  }
 }
 .header_links {
  display: flex;
  gap: 0.5em;
  margin-left: 0.5em;
 }
 .timetable {
  &-count {
    margin-left: 0.5em;
@@ -355,7 +386,8 @@ export default defineComponent({
  flex-wrap: wrap;
  font-size: 1.1em;
-  padding: 0.75em 0;
+
  margin-top: 0.5em;
  button.checkpoint_item {
    color: #aaa;
@@ -2,33 +2,45 @@
  <section class="scenery-timetables-history scenery-section">
    <Loading v-if="dataStatus != 2" />
-    <div class="list-warning" v-else-if="sceneryHistoryList.length == 0">{{ $t('scenery.history-list-empty') }}</div>
+    <table class="scenery-history-table" v-else-if="historyList.length">
-    <ul class="history-list" v-else>
+      <thead>
-      <li class="list-item" v-for="historyItem in sceneryHistoryList">
+        <th>{{ $t('scenery.timetables-history-id') }}</th>
-        <div>
+        <th>{{ $t('scenery.timetables-history-number') }}</th>
        <th>{{ $t('scenery.timetables-history-route') }}</th>
        <th>{{ $t('scenery.timetables-history-driver') }}</th>
        <th>{{ $t('scenery.timetables-history-author') }}</th>
        <th>{{ $t('scenery.timetables-history-date') }}</th>
      </thead>
      <tbody>
        <tr v-for="historyItem in historyList">
          <td>
            <router-link :to="`/journal/timetables?timetableId=${historyItem.id}`">#{{ historyItem.id }}</router-link>
          </td>
          <td>
            <b class="text--primary">{{ historyItem.trainCategoryCode }}</b> <br />
            {{ historyItem.trainNo }}
          </td>
          <td>{{ historyItem.route.replace('|', ' -> ') }}</td>
          <td>{{ historyItem.driverName }}</td>
          <td>
            <router-link
              v-if="historyItem.authorName"
              :to="`/journal/dispatchers?dispatcherName=${historyItem.authorName}`"
              >{{ historyItem.authorName }}
            </router-link>
            <i v-else>{{ $t('scenery.timetable-author-unknown') }}</i>
          </td>
          <td>
            <b>{{ localeDay(historyItem.beginDate, $i18n.locale) }}</b>
            {{ localeTime(historyItem.beginDate, $i18n.locale) }}
-        </div>
+          </td>
        </tr>
      </tbody>
    </table>
-        <div>
+    <div class="no-history" v-else>{{ $t('scenery.history-list-empty') }}</div>
-          <router-link :to="`/journal/timetables?timetableId=${historyItem.id}`">
+    <div ref="bottomDiv"></div>
            <span class="text--grayed"> #{{ historyItem.id }} </span>
            <b class="text--primary">&nbsp;{{ historyItem.trainCategoryCode }} {{ historyItem.trainNo }}</b>
            <div>{{ historyItem.driverName }}</div>
          </router-link>
        </div>
        <div>{{ historyItem.route.replace('|', ' -> ') }}</div>
        <!-- <div>{{ historyItem.routeDistance }} km</div> -->
        <div>
          {{ $t('scenery.timetable-author-title') }}:
          <b v-if="historyItem.authorName">{{ historyItem.authorName }}</b>
          <i v-else>{{ $t('scenery.timetable-author-unknown') }}</i>
        </div>
        <!-- <div v-if="historyItem.authorId">{{ historyItem.authorName }}</div> -->
      </li>
    </ul>
  </section>
 </template>
@@ -41,37 +53,54 @@ import { TimetableHistory, SceneryTimetableHistory } from '../../scripts/interfa
 import Station from '../../scripts/interfaces/Station';
 import { URLs } from '../../scripts/utils/apiURLs';
 import Loading from '../Global/Loading.vue';
 import listObserverMixin from '../../mixins/listObserverMixin';
 export default defineComponent({
  name: 'SceneryTimetablesHistory',
-  mixins: [dateMixin],
+  mixins: [dateMixin, listObserverMixin],
  props: {
    station: {
      type: Object as PropType<Station>,
      required: true,
    },
  },
  data() {
    return {
-      sceneryHistoryList: [] as TimetableHistory[],
+      historyList: [] as TimetableHistory[],
      dataStatus: DataStatus.Loading,
    };
  },
  mounted() {
-    this.fetchAPIData();
+    this.mountObserver(this.fireObserverAction, this.$refs['bottomDiv'] as Element);
  },
  unmounted() {
    this.unmountObserver();
  },
  activated() {
    if (this.historyList.length == 0) this.fetchAPIData();
  },
  methods: {
    async fetchAPIData(countFrom = 0, countLimit = 15) {
      try {
-        const requestString = `${URLs.stacjownikAPI}/api/getSceneryTimetables?name=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
+        const requestString = `${URLs.stacjownikAPI}/api/getIssuedTimetables?name=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
        const historyAPIData: SceneryTimetableHistory = await (await axios.get(requestString)).data;
-        this.sceneryHistoryList = historyAPIData.sceneryTimetables;
+        this.historyList.push(...historyAPIData.timetables);
        this.dataStatus = DataStatus.Loaded;
      } catch (error) {
        console.error(error);
      }
    },
    fireObserverAction() {
      if (this.historyList.length > 0 && this.dataStatus == DataStatus.Loaded)
        this.fetchAPIData(this.historyList.length);
    },
  },
  components: { Loading },
 });
@@ -79,34 +108,5 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
-@import '../../styles/SceneryView/styles.scss';
+@import '../../styles/sceneryViewTables.scss';
 .list-warning {
  padding: 1em 0.5em;
  background-color: #444;
  font-size: 1.2em;
 }
 .history-list {
  padding: 0 0.5em;
 }
 .list-item {
  display: grid;
  grid-template-columns: 1fr 2fr 2fr 1fr;
  gap: 1em;
  align-items: center;
  background-color: #353535;
  padding: 0.5em;
  margin: 0.5em 0;
  line-height: 1.5em;
 }
@include smallScreen {
  .list-item {
    grid-template-columns: 1fr 1fr;
  }
 }
 </style>
@@ -1,47 +1,19 @@
 <template>
  <div class="general-status">
-    <span :class="scheduledTrain.stopStatus">
+    <span :class="computedScheduledTrain.stopStatus" :title="computedScheduledTrain.stopStatusDescription">
-      <span v-if="scheduledTrain.stopStatus == 'arriving'">
+      {{ computedScheduledTrain.stopStatusIndicator }}
        <span v-if="scheduledTrain.prevDepartureLine">({{ scheduledTrain.prevDepartureLine }})</span>
        {{ scheduledTrain.prevStationName }}
        &gt;<span v-if="scheduledTrain.nextArrivalLine"> ({{ scheduledTrain.nextArrivalLine }}) </span>
        {{ scheduledTrain.nextStationName || '---' }}
      </span>
      <span v-else-if="scheduledTrain.stopStatus == 'departed'">
        &gt;&gt; <span v-if="scheduledTrain.nextArrivalLine"> ({{ scheduledTrain.nextArrivalLine }}) </span>
        {{ scheduledTrain.nextStationName }}
      </span>
      <span v-else-if="scheduledTrain.stopStatus == 'departed-away'">
        &gt;&gt;&gt;
        <span v-if="scheduledTrain.nextArrivalLine"> ({{ scheduledTrain.nextArrivalLine }}) </span>
        {{ scheduledTrain.nextStationName }}
      </span>
      <span v-else-if="scheduledTrain.stopStatus == 'online'">
        &gt;
        <span v-if="scheduledTrain.nextArrivalLine">
          ({{ scheduledTrain.nextArrivalLine }}) {{ scheduledTrain.nextStationName }}
        </span>
        <span v-else-if="!scheduledTrain.nextStationName">{{ $t('timetables.end') }}</span>
        <span v-else>{{ scheduledTrain.nextStationName }}</span>
      </span>
      <span v-else-if="scheduledTrain.stopStatus == 'stopped'">
        &gt;
        <span v-if="scheduledTrain.nextArrivalLine"> ({{ scheduledTrain.nextArrivalLine }}) </span>
        {{ scheduledTrain.nextStationName }}
      </span>
      <span v-else-if="scheduledTrain.stopStatus == 'terminated'">X {{ $t('timetables.terminated') }}</span>
    </span>
  </div>
 </template>
 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
-import ScheduledTrain from '../../scripts/interfaces/ScheduledTrain';
+import { ScheduledTrain, StopStatus } from '../../scripts/interfaces/ScheduledTrain';
 interface ScheduledTrainComp extends ScheduledTrain {
  stopStatusIndicator: string;
  stopStatusDescription: string;
 }
 export default defineComponent({
  props: {
@@ -50,6 +22,58 @@ export default defineComponent({
      required: true,
    },
  },
  computed: {
    computedScheduledTrain(): ScheduledTrainComp {
      const { prevDepartureLine, prevStationName, stopStatus, nextArrivalLine, nextStationName } = this.scheduledTrain;
      const prevDepartureIndicator = prevDepartureLine ? `(${prevDepartureLine}) ${prevStationName}` : '---';
      const nextArrivalIndicator = nextArrivalLine ? `(${nextArrivalLine}) ${nextStationName}` : '---';
      let stopStatusDescription = '',
        stopStatusIndicator = '';
      switch (stopStatus) {
        case StopStatus.arriving:
          stopStatusIndicator = `${this.$t('timetables.from')}: ${prevDepartureIndicator}`;
          stopStatusDescription = this.$t('timetables.desc-arriving', { prevStationName, prevDepartureLine });
          break;
        case StopStatus.online:
        case StopStatus.stopped:
          stopStatusIndicator = nextArrivalLine
            ? `${this.$t('timetables.to')}: ${nextArrivalIndicator}`
            : `${this.$t('timetables.desc-end')}`;
          stopStatusDescription = nextArrivalLine
            ? this.$t(`timetables.desc-${stopStatus}`, { nextStationName, nextArrivalLine })
            : '';
          break;
        case StopStatus.departed:
          stopStatusIndicator = `${this.$t('timetables.to')}: ${nextArrivalIndicator}`;
          stopStatusDescription = this.$t('timetables.desc-departed', { nextStationName, nextArrivalLine });
          break;
        case StopStatus['departed-away']:
          stopStatusIndicator = `${this.$t('timetables.to')}: ${nextArrivalIndicator}`;
          stopStatusDescription = this.$t('timetables.desc-departed-away', { nextStationName, nextArrivalLine });
          break;
        case StopStatus.terminated:
          stopStatusIndicator = `X ${this.$t('timetables.desc-terminated')}`;
          stopStatusDescription = this.$t('timetables.desc-terminated');
          break;
        default:
          break;
      }
      return {
        ...this.scheduledTrain,
        stopStatusDescription,
        stopStatusIndicator,
      };
    },
  },
 });
 </script>
@@ -86,3 +110,4 @@ export default defineComponent({
  }
 }
 </style>
@@ -1,5 +1,11 @@
 <template>
-  <button class="btn--action" :class="option.section" :data-selected="option.value" @click="handleChange">
+  <button
    class="btn--action"
    :class="option.section"
    :data-selected="option.value"
    @click="handleLeftClick"
    @dblclick="handleDbClick"
  >
    {{ $t(`filters.${option.id}`) }}
  </button>
 </template>
@@ -29,20 +35,48 @@ export default defineComponent({
      filterStore: useStationFiltersStore(),
    };
  },
  methods: {
-    handleChange() {
+    handleLeftClick() {
      this.option.value = !this.option.value;
      this.filterStore.lastClickedFilterId = '';
      this.filterStore.changeFilterValue({
        name: this.option.name,
        value: !this.option.value,
      });
    },
    handleDbClick(e: Event) {
      e.preventDefault();
      this.filterStore.lastClickedFilterId = this.option.id;
      this.option.value = true;
      this.filterStore.changeFilterValue({
        name: this.option.name,
        value: !this.option.value,
      });
      this.filterStore.inputs.options
        .filter((option) => {
          return option.section == this.option.section && option.id != this.option.id;
        })
        .forEach((option) => {
          this.filterStore.changeFilterValue({
            name: option.name,
            value: this.option.value,
          });
          option.value = !this.option.value;
        });
    },
  },
 });
 </script>
 <style lang="scss" scoped>
 $realityCol: #e03b07;
 $accessCol: #e03b07;
 $controlCol: #0085ff;
 $signalCol: #bf7c00;
@@ -51,56 +85,17 @@ $saveCol: #28a826;
 $routesCol: #9049c0;
 button {
-  width: 100%;
+  padding: 0.25em;
-  padding: 0.4em;
+  border-radius: 0;
  border-radius: 0.4em;
  &:focus-visible {
    outline: 1px solid white;
  }
  &[data-selected='true'] {
-    &.access {
+    background-color: forestgreen;
-      background-color: $accessCol;
+    font-weight: bold;
      box-shadow: 0 0 6px 1px $accessCol;
    }
    &.control {
      background-color: $controlCol;
      box-shadow: 0 0 6px 1px $controlCol;
    }
    &.signals {
      background-color: $signalCol;
      box-shadow: 0 0 6px 1px $signalCol;
    }
    &.routes {
      background-color: $routesCol;
      box-shadow: 0 0 6px 1px $routesCol;
    }
    &.status {
      background-color: $statusCol;
      box-shadow: 0 0 6px 1px $statusCol;
    }
    &.save {
      background-color: $saveCol;
      box-shadow: 0 0 6px 1px $saveCol;
    }
    &.troll {
      background-color: firebrick;
      box-shadow: 0 0 6px 1px firebrick;
    }
    &.mode {
      background-color: lightgreen;
      color: black;
      font-weight: 500;
    }
  }
 }
 </style>
@@ -26,15 +26,28 @@
      <div class="card" v-if="isVisible" tabindex="0" ref="cardEl">
        <div class="card_content">
          <div class="card_title flex">{{ $t('filters.title') }}</div>
          <p class="card_info" v-html="$t('filters.desc')"></p>
          <section class="card_options">
            <div class="option-section" v-for="section in filterStore.inputs.optionSections">
              <h3 class="text--primary">
                {{ $t(`filters.sections.${section}`) }}
                <button @click="filterStore.resetSectionOptions(section)">RESET</button>
              </h3>
              <hr />
              <div class="section-inputs">
                <filter-option
-              v-for="(option, i) in filterStore.inputs.options"
+                  v-for="(option, i) in filterStore.inputs.options.filter((o) => o.section == section)"
                  :option="option"
                  :key="i"
              @optionChange="handleChange"
                />
              </div>
            </div>
          </section>
          <section class="card_timestamp" style="text-align: center">
            <div>{{ $t('filters.minimum-hours-title') }}</div>
            <span class="clock">
@@ -80,6 +93,7 @@
              </div>
            </div>
          </section>
        </div>
        <section class="card_actions">
          <div class="action-buttons">
@@ -87,12 +101,18 @@
              {{ $t('filters.save') }}
            </button>
-              <button class="btn--action" @click="resetFilters">{{ $t('filters.reset') }}</button>
+            <button
              class="btn--action"
              @click="resetFilters"
              :disabled="filterStore.areFiltersAtDefault"
              :data-disabled="filterStore.areFiltersAtDefault"
            >
              {{ $t('filters.reset') }}
            </button>
            <button class="btn--action" @click="closeCard">{{ $t('filters.close') }}</button>
          </div>
        </section>
      </div>
      </div>
    </transition>
  </section>
 </template>
@@ -181,15 +201,6 @@ export default defineComponent({
      this.isVisible = !this.isVisible;
    },
    handleChange(change: { name: string; value: boolean }) {
      this.filterStore.changeFilterValue({
        name: change.name,
        value: !change.value,
      });
      if (this.saveOptions) StorageManager.setBooleanValue(change.name, change.value);
    },
    handleInput(e: Event) {
      const target = e.target as HTMLInputElement;
@@ -281,6 +292,14 @@ export default defineComponent({
 }
 .card {
  display: grid;
  grid-template-rows: 1fr auto;
  &_info {
    background-color: #111;
    padding: 0.5em;
  }
  &_controls {
    display: flex;
    gap: 0.5em;
@@ -292,13 +311,13 @@ export default defineComponent({
  }
  &_content {
    padding: 1em 0.5em;
    display: flex;
    flex-direction: column;
    gap: 1em;
-
+    overflow: auto;
    max-height: 90vh;
    padding: 1em;
  }
  &_title {
@@ -309,18 +328,6 @@ export default defineComponent({
    text-align: center;
  }
  &_options {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(4, 1fr);
    gap: 0.5em;
    @include smallScreen() {
      grid-template-columns: repeat(auto-fit, minmax(8em, 1fr));
      grid-template-rows: auto;
    }
  }
  &_regions {
    display: flex;
    justify-content: center;
@@ -391,6 +398,9 @@ export default defineComponent({
  }
  &_actions {
    width: 100%;
    padding: 0.5em;
    .filter-option {
      max-width: 50%;
      margin: 0 auto;
@@ -409,14 +419,42 @@ export default defineComponent({
        padding: 0.5em;
        &[data-selected='true'] {
-          background-color: lightgreen;
+          background-color: forestgreen;
          color: black;
        }
      }
    }
  }
 }
 .card_options {
  .option-section h3 {
    display: flex;
    align-items: center;
    margin-bottom: 0.25em;
    gap: 0.5em;
    button {
      padding: 0.15em;
      color: coral;
    }
  }
  .section-inputs {
    display: grid;
    // flex-wrap: wrap;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    // grid-template-rows: repeat(3, 1fr);
    gap: 0.5em;
    margin: 1em 0;
    // @include smallScreen() {
    //   grid-template-columns: repeat(auto-fit, minmax(8em, 1fr));
    //   grid-template-rows: auto;
    // }
  }
 }
 .slider {
  display: flex;
  align-items: center;
@@ -8,26 +8,36 @@
      <table>
        <thead>
          <tr>
-            <th v-for="(id, i) in headIds" :key="id" @click="() => changeSorter(i)">
+            <th
              v-for="(headerName, i) in headIds"
              :key="headerName"
              @click="changeSorter(headerName)"
              class="header-text"
            >
              <span class="header_wrapper">
-                <div v-html="$t(`sceneries.${id}`)"></div>
+                <div v-html="$t(`sceneries.${headerName}`)"></div>
                <img
                  class="sort-icon"
-                  v-if="sorterActive.index == i"
+                  v-if="sorterActive.headerName == headerName"
                  :src="sorterActive.dir == 1 ? getIcon('arrow-asc') : getIcon('arrow-desc')"
                  alt="sort icon"
                />
              </span>
            </th>
-            <th v-for="(id, i) in headIconsIds" :key="id" @click="() => changeSorter(i + 7)">
+            <th
              v-for="(headerName, i) in headIconsIds"
              :key="headerName"
              @click="changeSorter(headerName)"
              class="header-image"
            >
              <span class="header_wrapper">
-                <img :src="getIcon(id)" :alt="id" :title="$t(`sceneries.${id}s`)" />
+                <img :src="getIcon(headerName)" :alt="headerName" :title="$t(`sceneries.${headerName}`)" />
                <img
                  class="sort-icon"
-                  v-if="sorterActive.index == i + 7"
+                  v-if="sorterActive.headerName == headerName"
                  :src="sorterActive.dir == 1 ? getIcon('arrow-asc') : getIcon('arrow-desc')"
                  alt="sort icon"
                />
@@ -190,25 +200,31 @@
            <td class="station_users" :class="{ inactive: !station.onlineInfo }">
              <span>
-                <span class="highlight">{{ station.onlineInfo?.currentUsers || '0' }}</span>
+                <span class="highlight">{{ station.onlineInfo?.currentUsers || 0 }}</span>
                /
-                <span>{{ station.onlineInfo?.maxUsers || '0' }}</span>
+                <span class="highlight">{{ station.onlineInfo?.maxUsers || 0 }}</span>
              </span>
            </td>
            <td class="station_spawns" :class="{ inactive: !station.onlineInfo }">
-              <span class="highlight">{{ station.onlineInfo?.spawns.length || '0' }}</span>
+              <span>{{ station.onlineInfo?.spawns.length || 0 }}</span>
            </td>
-            <td class="station_schedules" :class="{ inactive: !station.onlineInfo }">
+            <td class="station_schedules" style="width: 30px" :class="{ inactive: !station.onlineInfo }">
              <span>
              <span class="highlight">
-                  {{ station.onlineInfo?.scheduledTrains?.length || '0' }}
+                {{ station.onlineInfo?.scheduledTrains?.length || 0 }}
              </span>
-                /
+            </td>
-                <span style="color: #bbb">
+
-                  {{ station.onlineInfo?.scheduledTrains?.filter((train) => train.stopInfo.confirmed).length || '0' }}
+            <td class="station_schedules" style="width: 30px" :class="{ inactive: !station.onlineInfo }">
              <span style="color: #ccc">
                {{ station.onlineInfo?.scheduledTrains?.filter((train) => !train.stopInfo.confirmed).length || 0 }}
              </span>
            </td>
            <td class="station_schedules" style="width: 30px" :class="{ inactive: !station.onlineInfo }">
              <span style="color: #66ff6c">
                {{ station.onlineInfo?.scheduledTrains?.filter((train) => train.stopInfo.confirmed).length || 0 }}
              </span>
            </td>
          </tr>
@@ -236,6 +252,7 @@ import Station from '../../scripts/interfaces/Station';
 import { useStationFiltersStore } from '../../store/stationFiltersStore';
 import { useStore } from '../../store/store';
 import Loading from '../Global/Loading.vue';
 import { HeadIdsTypes, headIconsIds, headIds } from '../../scripts/data/stationHeaderNames';
 export default defineComponent({
  props: {
@@ -249,8 +266,8 @@ export default defineComponent({
  mixins: [styleMixin, dateMixin, stationInfoMixin, returnBtnMixin, imageMixin],
  data: () => ({
-    headIds: ['station', 'min-lvl', 'status', 'dispatcher', 'dispatcher-lvl', 'routes', 'general'],
+    headIconsIds,
-    headIconsIds: ['user', 'spawn', 'timetable'],
+    headIds,
    lastSelectedStationName: '',
  }),
@@ -291,8 +308,10 @@ export default defineComponent({
      window.open(url, '_blank');
    },
-    changeSorter(i: number) {
+    changeSorter(headerName: HeadIdsTypes) {
-      this.stationFiltersStore.changeSorter(i);
+      if (headerName == 'general' || headerName == 'routes') return;
      this.stationFiltersStore.changeSorter(headerName);
    },
  },
 });
@@ -349,9 +368,15 @@ table {
    position: sticky;
    top: 0;
-    min-width: 75px;
+    &.header-text {
      min-width: 140px;
    }
-    padding: 0.5em;
+    &.header-image {
      min-width: 60px;
    }
    padding: 0.5em 0.25em;
    background-color: $bgCol;
    white-space: pre-wrap;
@@ -6,20 +6,19 @@
        <span class="timetable-id" v-if="train.timetableData">#{{ train.timetableData.timetableId }}</span>
        <span class="timetable_warnings" v-if="train.timetableData?.TWR || train.timetableData?.SKR">
-          <span class="train-badge twr" v-if="train.timetableData?.TWR">TWR</span>
+          <span class="train-badge twr" v-if="train.timetableData?.TWR" :title="$t('general.TWR')">TWR</span>
-          <span class="train-badge skr" v-if="train.timetableData?.SKR">SKR</span>
+          <span class="train-badge skr" v-if="train.timetableData?.SKR" :title="$t('general.SKR')">SKR</span>
        </span>
        <strong>
-          <span v-if="train.timetableData">{{ train.timetableData.category }}&nbsp;</span>
+          <span v-if="train.timetableData" class="text--primary">{{ train.timetableData.category }}&nbsp;</span>
          <span class="train-number">{{ train.trainNo }}</span>
        </strong>
-        <span>|</span>
+        <span>&bull;</span>
-        <span>{{ train.driverName }}</span>
+        <b class="level-badge driver" :style="calculateExpStyle(train.driverLevel, train.isSupporter)">
-        <span>|</span>
+          {{ train.driverLevel < 2 ? 'L' : `${train.driverLevel}` }}
        <b :style="calculateTextExpStyle(train.driverLevel, train.isSupporter)">
          {{ train.driverLevel < 2 ? 'L' : `${train.driverLevel} lvl` }}
        </b>
        <span>{{ train.driverName }}</span>
      </div>
      <div class="timetable_route" v-if="train.timetableData">
@@ -117,6 +116,7 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
@import '../../styles/badge.scss';
 .image-warning {
  height: 1em;
@@ -172,6 +172,7 @@ export default defineComponent({
  flex-wrap: wrap;
  gap: 0.25em;
  margin-right: 1.5em;
 }
 .train-status-badges {
  display: flex;
@@ -180,26 +181,6 @@ export default defineComponent({
  gap: 0.25em;
 }
 .train-badge {
  padding: 0.1em 0.2em;
  border-radius: 0.2em;
  font-weight: bold;
  font-size: 0.9em;
  &.twr {
    background-color: var(--clr-twr);
  }
  &.skr {
    background-color: var(--clr-skr);
  }
  &.offline {
    background-color: #9c362b;
  }
 }
 .train-driver {
  &.supporter {
    color: orange;
@@ -216,9 +197,7 @@ export default defineComponent({
 .timetable_warnings {
  display: flex;
-  gap: 0.2em;
+  gap: 0.25em;
  color: black;
 }
 .timetable_progress {
@@ -43,8 +43,8 @@
          <h1 class="option-title">{{ $t('options.sort-title') }}</h1>
          <div class="options_sorters">
            <div v-for="opt in translatedSorterOptions">
            <button
              v-for="opt in translatedSorterOptions"
              class="sort-option btn--option"
              :data-selected="opt.id == sorterActive.id"
              @click="onSorterChange(opt)"
@@ -52,23 +52,28 @@
              {{ opt.value.toUpperCase() }}
            </button>
          </div>
          </div>
          <h1 class="option-title" v-if="trainFilterList.length != 0">{{ $t('options.filter-title') }}</h1>
          <div class="options_filters">
-            <div class="filter-option" v-for="filter in trainFilterList">
+            <div v-for="section in Object.keys(TrainFilterSection)">
-              <button class="btn--option" :data-inactive="!filter.isActive" @click="onFilterChange(filter)">
+              <button
                class="btn--option"
                v-for="filter in trainFilterList.filter((f) => f.section == section)"
                :data-inactive="!filter.isActive"
                @click="onFilterChange(filter)"
              >
                {{ $t(`options.filter-${filter.id}`) }}
              </button>
            </div>
          </div>
          <div class="filter-actions">
-              <button class="btn--action" @click="clearAllFilters">{{ $t('options.filter-clear') }}</button>
+            <div></div>
            <button class="btn--action" @click="resetAllFilters">{{ $t('options.filter-reset') }}</button>
          </div>
        </div>
      </div>
      </div>
    </transition>
  </div>
 </template>
@@ -77,9 +82,10 @@
 import { defineComponent, inject, PropType } from 'vue';
 import imageMixin from '../../mixins/imageMixin';
 import keyMixin from '../../mixins/keyMixin';
 import { TrainFilter } from '../../types/Trains/TrainOptionsTypes';
 import ActionButton from '../Global/ActionButton.vue';
 import SelectBox from '../Global/SelectBox.vue';
 import { TrainFilterSection } from '../../scripts/enums/TrainFilterType';
 import { TrainFilter } from '../../scripts/interfaces/Trains/TrainFilter';
 export default defineComponent({
  components: { SelectBox, ActionButton },
@@ -101,6 +107,7 @@ export default defineComponent({
    return {
      showOptions: false,
      lastSelectedFilter: null as TrainFilter | null,
      TrainFilterSection,
    };
  },
@@ -183,13 +190,24 @@ export default defineComponent({
  margin: 0 auto;
 }
-.filter-option {
+.options_sorters {
  display: flex;
  grid-template-columns: repeat(3, 1fr);
 }
 .options_filters > div {
  display: flex;
  width: 100%;
  gap: 0.5em;
  button {
-    color: white;
+    width: 100%;
    color: springgreen;
    font-weight: bold;
-    &[data-disabled='true'] {
+    &[data-inactive='true'] {
-      color: #888;
+      color: #aaa;
    }
  }
 }
@@ -201,7 +219,7 @@ export default defineComponent({
  margin-top: 1em;
-  button {
+  > * {
    width: 100%;
  }
 }
@@ -89,6 +89,7 @@ import dateMixin from '../../mixins/dateMixin';
 import imageMixin from '../../mixins/imageMixin';
 import Train from '../../scripts/interfaces/Train';
 import TrainStop from '../../scripts/interfaces/TrainStop';
 import { useStore } from '../../store/store';
 import StopDate from '../Global/StopDate.vue';
 export default defineComponent({
@@ -106,6 +107,8 @@ export default defineComponent({
  setup(props) {
    return {
      store: useStore(),
      lastConfirmed: computed(() => {
        return props.train.timetableData!.followingStops.findIndex(
          (stop, i, stops) => stop.confirmed && !stops[i + 1]?.confirmed && !stops[i + 1]?.stopped
@@ -199,7 +202,6 @@ ul.stock-list {
  img {
    max-height: 60px;
    max-width: 320px;
  }
 }
@@ -424,3 +426,4 @@ ul.stop_list > li.stop {
  }
 }
 </style>
@@ -12,10 +12,6 @@
          {{ $t('trains.no-trains') }}
        </div>
        <!-- <div class="timeouts-warning" v-if="trainNumbersWithTimeouts.length == 0">
          <b class="warning-timeout">?</b>
          {{ $t('trains.timeout') }}
        </div> -->
        <transition-group name="list-anim" tag="ul" class="train-list" v-else>
          <li
            class="train-row"
@@ -70,18 +66,9 @@ export default defineComponent({
        id: string | number;
        dir: number;
      },
      distanceLimitExceeded: computed(
        () => props.trains.findIndex(({ timetableData }) => timetableData && timetableData.routeDistance > 200) != -1
      ),
    };
  },
  computed: {
    trainNumbersWithTimeouts() {
      return this.store.trainList.filter((train) => train.isTimeout).map((train) => train.trainNo);
    },
  },
  activated() {
    const query = this.$route.query;
    if (query.trainNo && query.driverName) {
@@ -1,28 +1,46 @@
-import { JournalFilterType } from "../../scripts/enums/JournalFilterType";
+import { JournalFilterSection, JournalFilterType } from '../../scripts/enums/JournalFilterType';
-import { JournalTimetableFilter } from "../../types/Journal/JournalTimetablesTypes";
+import { JournalFilter } from '../../scripts/types/JournalTimetablesTypes';
-export const journalTimetableFilters: JournalTimetableFilter[] = [
+export const journalTimetableFilters: JournalFilter[] = [
  {
-    id: JournalFilterType.all,
+    id: JournalFilterType.ALL,
-    filterSection: 'timetable-status',
+    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: true,
  },
  {
-    id: JournalFilterType.active,
+    id: JournalFilterType.ACTIVE,
-    filterSection: 'timetable-status',
+    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: false,
  },
  {
-    id: JournalFilterType.fulfilled,
+    id: JournalFilterType.FULFILLED,
-    filterSection: 'timetable-status',
+    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: false,
  },
  {
-    id: JournalFilterType.abandoned,
+    id: JournalFilterType.ABANDONED,
-    filterSection: 'timetable-status',
+    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: false,
  },
  {
    id: JournalFilterType.TWR_SKR,
    filterSection: JournalFilterSection.TWRSKR,
    isActive: true,
  },
  {
    id: JournalFilterType.TWR,
    filterSection: JournalFilterSection.TWRSKR,
    isActive: false,
  },
  {
    id: JournalFilterType.SKR,
    filterSection: JournalFilterSection.TWRSKR,
    isActive: false,
  },
 ];
@@ -1,33 +1,58 @@
-import { TrainFilterType } from '../../scripts/enums/TrainFilterType';
+import { TrainFilterSection, TrainFilterType } from '../../scripts/enums/TrainFilterType';
-import { TrainFilter } from '../../types/Trains/TrainOptionsTypes';
+import { TrainFilter } from '../../scripts/interfaces/Trains/TrainFilter';
 export const trainFilters: TrainFilter[] = [
  {
    id: TrainFilterType.twr,
    section: TrainFilterSection.TRAIN_TYPE,
    isActive: true,
  },
  {
    id: TrainFilterType.skr,
    section: TrainFilterSection.TRAIN_TYPE,
    isActive: true,
  },
  {
    id: TrainFilterType.common,
    section: TrainFilterSection.TRAIN_TYPE,
    isActive: true,
  },
  {
    id: TrainFilterType.passenger,
    section: TrainFilterSection.TIMETABLE_TYPE,
    isActive: true,
  },
  {
    id: TrainFilterType.freight,
    section: TrainFilterSection.TIMETABLE_TYPE,
    isActive: true,
  },
  {
    id: TrainFilterType.other,
    section: TrainFilterSection.TIMETABLE_TYPE,
    isActive: true,
  },
  {
    id: TrainFilterType.withComments,
    section: TrainFilterSection.COMMENTS,
    isActive: true,
  },
  {
-    id: TrainFilterType.comments,
+    id: TrainFilterType.noComments,
    section: TrainFilterSection.COMMENTS,
    isActive: true,
  },
  {
    id: TrainFilterType.withTimetable,
    section: TrainFilterSection.TIMETABLE,
    isActive: true,
  },
  {
    id: TrainFilterType.noTimetable,
    section: TrainFilterSection.TIMETABLE,
    isActive: true,
  },
 ];
@@ -1,41 +1,38 @@
 {
  "optionSections": ["reality", "package-access", "access", "control", "addons", "blockades", "signals", "status"],
  "options": [
    {
      "id": "default",
      "name": "default",
      "iconName": "td2",
      "section": "access",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "not-default",
      "name": "notDefault",
      "iconName": "",
      "section": "access",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "real",
      "name": "real",
-      "iconName": "lock",
+      "section": "reality",
      "section": "access",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "fictional",
      "name": "fictional",
-      "iconName": "user",
+      "section": "reality",
-      "section": "access",
+      "value": true,
      "defaultValue": true
    },
    {
      "id": "default",
      "name": "default",
      "section": "package-access",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "not-default",
      "name": "notDefault",
      "section": "package-access",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "non-public",
      "name": "nonPublic",
      "iconName": "user",
      "section": "access",
      "value": true,
      "defaultValue": true
@@ -43,7 +40,6 @@
    {
      "id": "unavailable",
      "name": "unavailable",
      "iconName": "user",
      "section": "access",
      "value": false,
      "defaultValue": false
@@ -51,7 +47,6 @@
    {
      "id": "abandoned",
      "name": "abandoned",
      "iconName": "user",
      "section": "access",
      "value": false,
      "defaultValue": false
@@ -59,7 +54,6 @@
    {
      "id": "SPK",
      "name": "SPK",
      "iconName": "SPK",
      "section": "control",
      "value": true,
      "defaultValue": true
@@ -67,7 +61,6 @@
    {
      "id": "SCS",
      "name": "SCS",
      "iconName": "SCS",
      "section": "control",
      "value": true,
      "defaultValue": true
@@ -75,15 +68,21 @@
    {
      "id": "SPE",
      "name": "SPE",
-      "iconName": "SPE",
+      "section": "control",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "SPK-M",
      "name": "mechaniczne+SPK",
      "section": "control",
      "value": true,
      "defaultValue": true
    },
    {
-      "id": "manual",
+      "id": "SCS-M",
-      "name": "ręczne",
+      "name": "mechaniczne+SCS",
      "iconName": "ręczne",
      "section": "control",
      "value": true,
      "defaultValue": true
@@ -91,7 +90,27 @@
    {
      "id": "mechanical",
      "name": "mechaniczne",
-      "iconName": "mechaniczne",
+      "section": "control",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "SPK-R",
      "name": "ręczne+SPK",
      "section": "control",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "SCS-R",
      "name": "ręczne+SCS",
      "section": "control",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "manual",
      "name": "ręczne",
      "section": "control",
      "value": true,
      "defaultValue": true
@@ -99,23 +118,34 @@
    {
      "id": "SUP",
      "name": "SUP",
-      "iconName": "SUP",
+      "section": "addons",
-      "section": "control",
+      "value": true,
      "defaultValue": true
    },
    {
      "id": "noSUP",
      "name": "noSUP",
      "section": "addons",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "SBL",
      "name": "SBL",
-      "iconName": "SBL",
+      "section": "blockades",
-      "section": "routes",
+      "value": true,
      "defaultValue": true
    },
    {
      "id": "PBL",
      "name": "PBL",
      "section": "blockades",
      "value": true,
      "defaultValue": true
    },
    {
      "id": "modern",
      "name": "współczesna",
      "iconName": "współczesna",
      "section": "signals",
      "value": true,
      "defaultValue": true
@@ -123,7 +153,6 @@
    {
      "id": "semaphores",
      "name": "kształtowa",
      "iconName": "kształtowa",
      "section": "signals",
      "value": true,
      "defaultValue": true
@@ -131,7 +160,6 @@
    {
      "id": "mixed",
      "name": "mieszana",
      "iconName": "mieszana",
      "section": "signals",
      "value": true,
      "defaultValue": true
@@ -139,7 +167,6 @@
    {
      "id": "historical",
      "name": "historyczna",
      "iconName": "historyczna",
      "section": "signals",
      "value": true,
      "defaultValue": true
@@ -148,7 +175,6 @@
    {
      "id": "free",
      "name": "free",
      "iconName": "",
      "section": "status",
      "value": false,
@@ -157,7 +183,6 @@
    {
      "id": "occupied",
      "name": "occupied",
      "iconName": "",
      "section": "status",
      "value": true,
@@ -166,7 +191,6 @@
    {
      "id": "endingStatus",
      "name": "endingStatus",
      "iconName": "",
      "section": "status",
      "value": true,
@@ -175,7 +199,6 @@
    {
      "id": "afkStatus",
      "name": "afkStatus",
      "iconName": "",
      "section": "status",
      "value": true,
@@ -184,7 +207,6 @@
    {
      "id": "noSpaceStatus",
      "name": "noSpaceStatus",
      "iconName": "",
      "section": "status",
      "value": true,
@@ -193,7 +215,6 @@
    {
      "id": "unavailableStatus",
      "name": "unavailableStatus",
      "iconName": "",
      "section": "status",
      "value": true,
@@ -254,7 +275,6 @@
    {
      "id": "include-selected",
      "name": "include-selected",
      "iconName": "",
      "section": "mode",
      "value": true,
      "defaultValue": true
@@ -262,7 +282,6 @@
    {
      "id": "save",
      "name": "save",
      "iconName": "",
      "section": "mode",
      "value": true,
      "defaultValue": true
@@ -1,7 +1,9 @@
 {
  "general": {
    "and": " and ",
-    "refresh": "REFRESH"
+    "refresh": "REFRESH",
    "TWR": "High risk freight train",
    "SKR": "Train with exceeded gauge"
  },
  "app": {
    "sceneries": "SCENERIES",
@@ -15,6 +17,9 @@
    "migration-confirm": "Roger that!",
    "offline": "App is in the offline mode!"
  },
  "footer": {
    "discord": "Stacjownik Discord server"
  },
  "update": {
    "title": "New version of the app is available!",
    "paragraph1": "Enjoy the application and may the green signal be with you!",
@@ -35,7 +40,7 @@
  "desc": {
    "control-type": "Control type: ",
    "signals-type": "Signals type:  ",
-    "SBL": "This scenery has automatic line blockade system on following routes: ",
+    "SBL": "This scenery has automatic block signalling (ABS/SBL) system on following routes: ",
    "SUP": "Requires the SUP application (level crossing remote control simulator)",
    "TWB-all": "This scenery has two-way route blockade on all routes",
    "TWB-routes": "This scenery has two-way route blockade on following routes: ",
@@ -94,48 +99,71 @@
    "search-dispatcher": "Dispatcher name",
    "search-station": "Scenery name",
    "search-author": "Timetable author name",
-    "search-date": "Timetable date (CEST / GMT+2)",
+    "search-issuedFrom": "Origin scenery name",
    "search-timetables-date": "Timetable date (UTC+2 / CEST)",
    "search-dispatchers-date": "Service date (UTC+2 / CEST)",
    "search-date": "Date (UTC+2 / CEST)",
    "sort-mass": "mass",
    "sort-speed": "speed",
    "sort-length": "length",
-    "sort-distance": "distance",
+    "sort-routeDistance": "route distance",
    "sort-timetable": "train no.",
    "sort-progress": "route progress",
    "sort-delay": "current delay",
    "sort-id": "timetable id",
-    "sort-total-stops": "total stops",
+    "sort-allStopsCount": "total stops",
    "sort-beginDate": "date",
    "sort-timetableId": "timetable ID",
    "sort-timestampFrom": "date",
    "sort-duration": "duration",
-    "filter-comments": "COMMENTS",
+    "filter-noComments": "NO COMMENTS",
-    "filter-twr": "TWR",
+    "filter-withComments": "COMMENTS",
-    "filter-skr": "SKR",
+    "filter-twr": "HIGH RISK CARGO",
    "filter-skr": "EXCEEDED GAUGE",
    "filter-twr-skr": "ALL TYPES",
    "filter-common": "NO WARNINGS",
    "filter-passenger": "PASSENGER",
    "filter-freight": "FREIGHT",
    "filter-other": "OTHER",
    "filter-noTimetable": "NO TIMETABLE",
    "filter-withTimetable": "TIMETABLE",
    "filter-reset": "RESET FILTERS",
    "filter-clear": "CLEAR FILTERS",
    "filter-section-timetable-status": "TIMETABLE STATUS",
    "filter-section-twrskr": "WARNINGS",
    "filter-all": "ALL ENTRIES",
    "filter-abandoned": "ABANDONED",
    "filter-fulfilled": "FULFILLED",
    "filter-active": "ACTIVE"
  },
  "filters": {
    "desc": " &bull; Left mouse click: select / unselect chosen filter <br /> &bull; Double left click: unselect all filters but chosen from a <b class='text--primary'>group</b> <br /> &bull; <span style='color: coral'>RESET</span>: reset all filters from a <b class='text--primary'>group</b>",
    "sections": {
      "reality": "SCENERY REALITY",
      "package-access": "IN-GAME AVAILABILITY",
      "access": "GENERAL AVAILABILITY",
      "control": "CONTROLS",
      "signals": "SIGNALLING",
      "addons": "ADDITIONAL PROGRAMS",
      "blockades": "BLOCK SIGNALLING",
      "status": "ONLINE STATUS"
    },
    "endingStatus": "ENDS SOON",
    "afkStatus": "AFK",
    "noSpaceStatus": "NO SPACE",
    "unavailableStatus": "UNAVAILABLE",
-    "title": "STATION FILTER",
+    "title": "STATION FILTERS",
-    "default": "DEFAULT",
+    "default": "IN-GAME",
-    "not-default": "OTHER",
+    "not-default": "ADDITIONAL",
    "real": "REAL",
    "fictional": "FICTIONAL",
    "unavailable": "UNSUPPORTED",
@@ -143,12 +171,22 @@
    "abandoned": "ABANDONED",
    "SPK": "SPK",
    "SPK-R": "SPK + MANUAL",
    "SPK-M": "SPK + MECH.",
    "SCS": "SCS",
    "SCS-R": "SCS + MANUAL",
    "SCS-M": "SCS + MECH.",
    "SPE": "SPE",
    "manual": "MANUAL",
    "mechanical": "MECHANICAL",
-    "SUP": "SUP",
+
-    "SBL": "SBL",
+    "SUP": "SUP (RASP-UZK)",
    "noSUP": "WITHOUT SUP",
    "SBL": "AUTOMATIC (SBL)",
    "PBL": "SEMIAUTOMATIC (PBL)",
    "modern": "MODERN",
    "semaphores": "SEMAPHORES",
    "mixed": "MIXED",
@@ -169,7 +207,7 @@
    "hour": "h",
    "no-limit": "NO LIMIT",
    "include-selected": "INCLUDE SELECTED",
-    "save": "SAVE FILTERS",
+    "save": "REMEMBER FILTERS",
    "reset": "RESET FILTERS",
    "close": "CLOSE FILTERS"
  },
@@ -181,9 +219,11 @@
    "dispatcher-lvl": "Dispatcher\nlevel",
    "routes": "Routes\ndouble / single",
    "general": "General info",
-    "users": "Drivers online",
+    "user": "Drivers online",
-    "spawns": "Spawns online",
+    "spawn": "Spawns online",
-    "timetables": "Active timetables",
+    "timetableAll": "Active timetables",
    "timetableConfirmed": "Confirmed timetables",
    "timetableUnconfirmed": "Unconfirmed timetables",
    "no-stations": "No stations to show here!",
    "scenery-search": "Search for scenery..."
  },
@@ -234,6 +274,7 @@
    "title": "DISPATCHER HISTORY",
    "loading": "Loading dispatcher history data...",
    "no-history": "No dispatcher history found!",
    "data-refreshed-at": "Data refreshed at",
    "section-timetables": "TIMETABLES",
    "section-dispatchers": "DISPATCHERS",
@@ -251,13 +292,15 @@
    "online-since": "ONLINE SINCE",
    "duty-lasted": "The duty lasted",
    "minutes": "{minutes} mins",
    "hours": "{hours}h {minutes} mins",
-    "stock-info": "STOCK INFO",
+    "hours": "{value} hour | {value} hours",
    "minutes": "{value} min | {value} mins",
    "seconds": "{value} s",
    "stock-info": "EXTRA INFO",
    "stock-length": "Length",
    "stock-mass": "Mass",
-    "stock-max-speed": "Maximum registered speed",
+    "stock-max-speed": "Max. speed",
    "load-data": "Load further data...",
@@ -272,10 +315,13 @@
    "stats-distance": "DISTANCE",
    "stats-stations": "STATIONS",
-    "timetable-stats-total": "Today, dispatchers made so far {count} with total distance of {distance}",
+    "timetable-stats-title": "Daily stats on {date}",
-    "timetable-stats-longest": "The longest timetable today is #{id} made by {author} for {driver} - {distance}",
+    "timetable-stats-total": "Issued timetables: {count} (total distance: {distance})",
-    "timetable-stats-most-active": "The most active dispatcher today is {dispatcher} who created {count}",
+    "timetable-stats-longest": "The longest timetable: #{id} (made by {author} for {driver}, distance: {distance})",
-    "timetable-stats-most-active-many": "The most active dispatchers today are {dispatchers} who created {count} each",
+    "timetable-stats-most-active-dr": "The most active dispatcher: {dispatcher} (created {count})",
    "timetable-stats-most-active-dr-many": "The most active dispatchers: {dispatchers} (created {count} each)",
    "timetable-stats-most-active-driver": "The most active driver: {driver} (total driven distance: {distance})",
    "timetable-stats-longest-duties": "The longest service: {dispatcher} at {station} (duration: {duration})",
    "timetable-count": "timetable | timetables",
@@ -286,7 +332,10 @@
    "driver-stats-info": "Enter a proper nickname into filters [F] to see user's driving statistics!",
    "stats-loading": "Fetching statistics...",
-    "stats-error": "Oops! An unexpected error occurred while trying to fetch statistics! :/"
+    "stats-error": "Oops! An unexpected error occurred while trying to fetch statistics! :/",
    "timetable-location-signal": "signal:",
    "timetable-location-route": "route:"
  },
  "scenery": {
    "users": "PLAYERS ONLINE",
@@ -301,22 +350,33 @@
    "history-btn": "View the dispatcher history",
    "info-btn": "Return to the scenery view",
    "authors-title": "Scenery author | Scenery authors",
    "abbrev": "Station symbol:",
    "lines-title": "Real lines",
    "project-title": "Project name",
    "one-way-routes": "One way routes",
    "two-way-routes": "Two way routes",
    "option-active-timetables": "Active timetables",
-    "option-timetables-history": "Scenery timetables history",
+    "option-timetables-history": "Timetables history",
-    "option-dispatchers-history": "Scenery dispatchers history",
+    "option-dispatchers-history": "Dispatchers history",
    "timetable-author-title": "Issued by",
    "timetable-author-unknown": "Author unknown",
    "timetables-history-id": "ID",
    "timetables-history-number": "Number",
    "timetables-history-route": "Route",
    "timetables-history-driver": "Driver",
    "timetables-history-author": "TT author",
    "timetables-history-date": "Date",
    "req-level": "all dispatcher levels | dispatcher level {lvl} required | dispatcher level {lvl} required",
    "history-list-empty": "No recorded scenery history!",
-    "forum-topic": "Official {name} forum topic"
+    "forum-topic": "Official {name} forum topic",
    "pragotron-link": "Timetable pallet board (beta)",
    "tablice-link": "Timetable summary board (by Thundo)"
  },
  "availability": {
    "title": "Availability",
@@ -331,7 +391,19 @@
    "end": "Timetable terminates here",
    "terminated": "Timetable terminated",
    "begins": "BEGINS HERE",
-    "terminates": "TERMINATES\nHERE"
+    "terminates": "TERMINATES\nHERE",
    "from": "FROM",
    "to": "TO",
    "desc-arriving": "The train is not here yet. It's going to come from: {prevStationName} (szlak {prevDepartureLine})",
    "desc-online": "The train is at the station. It's going to leave to: {nextStationName} (szlak {nextArrivalLine})",
    "desc-stopped": "The train is at the station and is stopped. It's going to leave towards: {nextStationName} (szlak {nextArrivalLine})",
    "desc-next-arrival": "Leaves towards: {nextStationName} (szlak {nextArrivalLine})",
    "desc-departed": "The train is at the station and it's been departed. Leaves towards: {nextStationName} (szlak {nextArrivalLine})",
    "desc-departed-away": "The train has been departed to: {nextStationName} (szlak {nextArrivalLine})",
    "desc-end": "The train terminates here",
    "desc-terminated": "The train has been terminated"
  },
  "history": {
    "title": "TIMETABLE JOURNAL",
@@ -1,7 +1,9 @@
 {
  "general": {
    "and": " oraz ",
-    "refresh": "ODŚWIEŻ"
+    "refresh": "ODŚWIEŻ",
    "TWR": "Towar niebezpieczny wysokiego ryzyka",
    "SKR": "Przekroczona skrajnia"
  },
  "app": {
    "sceneries": "SCENERIE",
@@ -15,7 +17,9 @@
    "migration-confirm": "Przyjąłem!",
    "offline": "Aplikacja w trybie offline!"
  },
-
+  "footer": {
    "discord": "Serwer Discord Stacjownika"
  },
  "update": {
    "title": "Nowa wersja Stacjownika jest dostępna!",
    "paragraph1": "Miłego korzystania z aplikacji i niech S2 będzie z wami!",
@@ -23,7 +27,6 @@
    "confirm-button": "ZAKTUALIZUJ",
    "later-button": "PÓŹNIEJ"
  },
  "data-status": {
    "S1-offline": "<b>Sygnał S1</b> <br> Aplikacja działa w trybie offline!",
    "S1a-connection": "<b>Sygnał S1a</b> <br> Błąd podczas próby połączenia się z API Stacjownika!",
@@ -96,10 +99,13 @@
    "search-dispatcher": "Nick dyżurnego",
    "search-station": "Nazwa scenerii",
    "search-author": "Nick autora rozkładu jazdy",
-    "search-date": "Data rozkładu jazdy (czas polski)",
+    "search-issuedFrom": "Sceneria początkowa",
    "search-timetables-date": "Data rozkładu jazdy (UTC+2 / CEST)",
    "search-dispatchers-date": "Data służby (UTC+2 / CEST)",
    "search-date": "Data (UTC+2 / CEST)",
-    "sort-distance": "kilometraż",
+    "sort-routeDistance": "kilometraż",
-    "sort-total-stops": "stacje",
+    "sort-allStopsCount": "stacje",
    "sort-beginDate": "data",
    "sort-timetableId": "ID rozkładu",
    "sort-timestampFrom": "data",
@@ -114,23 +120,43 @@
    "sort-delay": "opóźnienie",
    "sort-comments": "uwagi ekspl.",
-    "filter-comments": "UWAGI EKSPLOATACYJNE",
+    "filter-withComments": "UWAGI EKSPLOATACYJNE",
-    "filter-twr": "TWR",
+    "filter-noComments": "BEZ UWAG",
-    "filter-skr": "PRZEKR. SKRAJNIA",
+    "filter-twr": "WYS. RYZYKA",
    "filter-skr": "SKRAJNIA",
    "filter-twr-skr": "WSZYSTKIE",
    "filter-common": "ZWYKŁE",
    "filter-passenger": "PASAŻERSKIE",
    "filter-freight": "TOWAROWE",
    "filter-other": "INNE",
    "filter-noTimetable": "BEZ RJ",
    "filter-withTimetable": "ROZKŁAD JAZDY",
    "filter-reset": "ZRESETUJ FILTRY",
    "filter-clear": "WYŁĄCZ FILTRY",
    "filter-section-timetable-status": "STATUS ROZKŁADU JAZDY",
    "filter-section-twrskr": "UWAGI",
    "filter-all": "WSZYSTKIE",
    "filter-abandoned": "PORZUCONE",
    "filter-fulfilled": "WYPEŁNIONE",
    "filter-active": "AKTYWNE"
  },
  "filters": {
    "desc": " &bull; Kliknięcie: zaznaczenie / odznaczenie filtru <br /> &bull; Podwójne kliknięcie: odznaczenie reszty filtrów z <b class='text--primary'>grupy</b> <br /> &bull; <span style='color: coral'>RESET</span>: zresetowanie filtrów z <b class='text--primary'>grupy</b>",
    "sections": {
      "reality": "FIKCYJNOŚĆ SCENERII",
      "package-access": "DOSTĘPNOŚĆ W PACZCE",
      "access": "DOSTĘPNOŚĆ OGÓLNA",
      "control": "TYP STEROWANIA",
      "signals": "TYP SYGNALIZACJI",
      "addons": "DODATKOWE PROGRAMY",
      "blockades": "BLOKADY LINIOWE",
      "status": "STATUS ONLINE"
    },
    "endingStatus": "KOŃCZY",
    "afkStatus": "Z/W",
    "noSpaceStatus": "BRAK MIEJSCA",
@@ -146,18 +172,29 @@
    "abandoned": "WYCOFANA",
    "SPK": "SPK",
    "SPK-R": "SPK + RĘCZNE",
    "SPK-M": "SPK + MECH.",
    "SCS": "SCS",
    "SCS-R": "SCS + RĘCZNE",
    "SCS-M": "SCS + MECH.",
    "SPE": "SPE",
    "manual": "RĘCZNE",
-    "SUP": "SUP",
+
-    "SBL": "SBL",
+    "SUP": "SUP (RASP-UZK)",
    "noSUP": "BEZ SUP",
    "SBL": "SAMOCZYNNA",
    "PBL": "PÓŁSAMOCZYNNA",
    "mechanical": "MECHANICZNE",
    "modern": "WSPÓŁCZESNA",
    "semaphores": "KSZTAŁTOWA",
    "mixed": "MIESZANA",
    "historical": "HISTORYCZNA",
    "free": "WOLNA",
    "occupied": "ZAJĘTA",
    "sliders": {
      "min-lvl": "MIN. WYMAGANY POZIOM DYŻURNEGO",
      "max-lvl": "MAKS. WYMAGANY POZIOM DYŻURNEGO",
@@ -166,27 +203,31 @@
      "routes-2t-cat": "SZLAKI DWUTOROWE ZELEKTR. (MINIMUM)",
      "routes-2t-other": "SZLAKI DWUTOROWE NIEZELEKTR. (MINIMUM)"
    },
    "authors-search": "Szukaj autora (uwzględnia inne filtry)",
    "minimum-hours-title": "POKAŻ TYLKO SCENERIE DOSTĘPNE MINIMUM DO:",
    "now": "TERAZ",
    "hour": " godz.",
    "no-limit": "BEZ LIMITU",
    "include-selected": "POKAŻ ZAZNACZONE",
-    "save": "ZAPISZ FILTRY",
+    "save": "ZAPAMIĘTAJ FILTRY",
    "reset": "RESETUJ FILTRY",
    "close": "ZAMKNIJ FILTRY"
  },
  "sceneries": {
    "station": "Stacja",
    "abbr": "Skrót\nposterunku",
    "min-lvl": "Min. poziom\ndyżurnego",
    "status": "Status",
    "dispatcher": "Dyżurny",
    "dispatcher-lvl": "Poziom\ndyżurnego",
    "routes": "Szlaki\n2tor / 1tor",
    "general": "Informacje\nogólne",
-    "users": "Maszyniści online",
+    "user": "Maszyniści online",
-    "spawns": "Otwarte spawny",
+    "spawn": "Otwarte spawny",
-    "timetables": "Aktywne rozkłady jazdy",
+    "timetableAll": "Aktywne rozkłady jazdy",
    "timetableConfirmed": "Zatwierdzone rozkłady jazdy",
    "timetableUnconfirmed": "Niezatwierdzone rozkłady jazdy",
    "no-stations": "Brak stacji do wyświetlenia!",
    "scenery-search": "Wyszukaj scenerię..."
  },
@@ -238,6 +279,7 @@
    "title": "HISTORIA DYŻURÓW",
    "loading": "Ładowanie historii dyżurów...",
    "no-history": "Brak historii dyżurów dla tej scenerii!",
    "data-refreshed-at": "Dane odświeżone o",
    "section-timetables": "ROZKŁADY JAZDY",
    "section-dispatchers": "DYŻURNI",
@@ -247,8 +289,9 @@
    "online-since": "ONLINE OD",
    "duty-lasted": "Dyżur trwał",
-    "minutes": "{minutes} min.",
+    "hours": "{value} godz.",
-    "hours": "{hours} godz. {minutes} min.",
+    "minutes": "{value} min.",
    "seconds": "{value} sek.",
    "route-length": "Kilometraż:",
    "station-count": "Stacje:",
@@ -258,10 +301,10 @@
    "timetable-fulfilled": "WYPEŁNIONY",
    "timetable-abandoned": "PORZUCONY",
-    "stock-info": "INFORMACJE O SKŁADZIE",
+    "stock-info": "DODATKOWE INFORMACJE",
    "stock-length": "Długość",
    "stock-mass": "Masa",
-    "stock-max-speed": "Maks. zarejestrowana prędkość",
+    "stock-max-speed": "Prędkość maks.",
    "load-data": "Pobierz dalszą historię...",
@@ -276,10 +319,12 @@
    "stats-distance": "DYSTANS",
    "stats-stations": "STACJE",
-    "timetable-stats-total": "Dyżurni stworzyli dziś {count}  o łącznym dystansie {distance}",
+    "timetable-stats-total": "Stworzone rozkłady jazdy: {count} (łączny dystans: {distance})",
-    "timetable-stats-longest": "Najdłuższym rozkładem jazdy jest dzisiaj #{id} stworzony przez dyżurnego {author} dla maszynisty {driver} - {distance}",
+    "timetable-stats-longest": "Najdłuższy rozkład jazdy: #{id} (stworzony przez dyżurnego {author} dla maszynisty {driver} o dystansie {distance})",
-    "timetable-stats-most-active": "Dzisiejszym najaktywniejszym dyżurnym jest {dispatcher}, który stworzył {count}",
+    "timetable-stats-most-active-dr": "Najaktywniejszy dyżurny: {dispatcher} (stworzył {count})",
-    "timetable-stats-most-active-many": "Dzisiejszymi najaktywniejszymi dyżurnymi są {dispatchers}, którzy stworzyli po {count}",
+    "timetable-stats-most-active-dr-many": "Najaktywniejsi dyżurni: {dispatchers} (stworzyli po {count})",
    "timetable-stats-most-active-driver": "Najaktywniejszy maszynista: {driver} (łączny przejechany dystans: {distance})",
    "timetable-stats-longest-duties": "Najdłuższa służba: {dispatcher} na scenerii {station} (czas trwania: {duration})",
    "timetable-count": "rozkład jazdy | rozkładów jazdy",
@@ -290,7 +335,10 @@
    "driver-stats-info": "Wpisz nazwę użytkownika w filtrach [F], aby zobaczyć jego statystyki maszynisty!",
    "stats-loading": "Pobieranie statystyk...",
-    "stats-error": "Ups! Wystąpił błąd podczas próby pobrania statystyk! :/"
+    "stats-error": "Ups! Wystąpił błąd podczas próby pobrania statystyk! :/",
    "timetable-location-signal": "semafor:",
    "timetable-location-route": "szlak:"
  },
  "scenery": {
    "users": "GRACZE ONLINE",
@@ -303,24 +351,35 @@
    "no-scenery": "Ups! Ta sceneria nie istnieje!",
    "return-btn": "Wróć na stronę główną",
    "history-btn": "Przejdź do widoku historii dyżurnych ruchu",
-    "info-btn": "Wróc do widoku scenerii",
+    "info-btn": "Wróć do widoku scenerii",
    "authors-title": "Autor scenerii | Autorzy scenerii",
    "abbrev": "Skrót posterunku:",
    "lines-title": "Rzeczywiste linie",
    "project-title": "Projekt",
    "one-way-routes": "Szlaki jednotorowe",
    "two-way-routes": "Szlaki dwutorowe",
    "option-active-timetables": "Aktywne rozkłady jazdy",
-    "option-timetables-history": "Historia rozkładów scenerii",
+    "option-timetables-history": "Historia rozkładów",
-    "option-dispatchers-history": "Historia dyżurów scenerii",
+    "option-dispatchers-history": "Historia dyżurów",
    "timetable-author-title": "Wydany przez",
    "timetable-author-unknown": "Autor nieznany",
    "timetables-history-id": "ID",
    "timetables-history-number": "Numer",
    "timetables-history-route": "Trasa",
    "timetables-history-driver": "Maszynista",
    "timetables-history-author": "Autor RJ",
    "timetables-history-date": "Data",
    "req-level": "ogólnodostępna | minimum {lvl} poziom dyżurnego | minimum {lvl} poziom dyżurnego",
    "history-list-empty": "Brak historii dla tej scenerii!",
-    "forum-topic": "Oficjalny wątek scenerii {name}"
+    "forum-topic": "Oficjalny wątek scenerii {name}",
    "pragotron-link": "Paletowa tablica informacyjna (beta)",
    "tablice-link": "Tablica informacyjna zbiorcza (autorstwa Thundo)"
  },
  "availability": {
    "title": "Dostępność",
@@ -335,7 +394,19 @@
    "end": "Koniec rozkładu jazdy",
    "terminated": "Rozkład jazdy zakończony",
    "begins": "ROZPOCZYNA\nBIEG",
-    "terminates": "KOŃCZY BIEG"
+    "terminates": "KOŃCZY BIEG",
    "from": "Z",
    "to": "DO",
    "desc-arriving": "Pociągu nie ma jeszcze na tej scenerii. Przyjedzie z: {prevStationName} (szlak {prevDepartureLine})",
    "desc-online": "Pociąg jest na tej scenerii. Odjedzie do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-stopped": "Pociąg jest na tej scenerii i odbywa postój. Odjedzie do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-next-arrival": "Odjeżdża do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-departed": "Pociąg jest na tej scenerii i został odprawiony. Odjeżdża do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-departed-away": "Pociąg został odprawiony i odjechał do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-end": "Pociąg kończy bieg",
    "desc-terminated": "Pociąg skończył bieg"
  },
  "history": {
    "title": "DZIENNIK ROZKŁADÓW JAZDY"
@@ -7,11 +7,11 @@ import plLang from './locales/pl.json';
 import { createI18n } from 'vue-i18n';
 import { createPinia } from 'pinia';
 import { registerSW } from 'virtual:pwa-register';
 const i18n = createI18n({
  locale: 'pl',
  legacy: false,
  warnHtmlMessage: false,
  fallbackLocale: 'pl',
  messages: {
    en: enLang,
@@ -20,15 +20,6 @@ const i18n = createI18n({
  enableLegacy: false,
 });
 registerSW({
  onRegistered(r) {
    r &&
      setInterval(() => {
        r.update();
      }, 60 * 60 * 1000);
  },
 });
 const clickOutsideDirective: Directive = {
  mounted(el, binding) {
    el.clickOutsideEvent = (event: Event) => {
@@ -28,6 +28,19 @@ export default defineComponent({
      });
    },
    stringToDate(dateString?: string) {
      return dateString ? new Date(dateString) : null;
    },
    parseDateToTimeString(date: Date | null) {
      return (
        date?.toLocaleTimeString('pl-PL', {
          hour: '2-digit',
          minute: '2-digit',
        }) || ''
      );
    },
    timestampToString(timestamp: number | null) {
      return timestamp
        ? new Date(timestamp).toLocaleTimeString('pl-PL', {
@@ -37,14 +50,21 @@ export default defineComponent({
        : '';
    },
-    calculateDuration(timestampMs: number) {
+    calculateDuration(timestampMs: number, showSeconds = false) {
      const secondsTotal = Math.floor(timestampMs / 1000);
      const minsTotal = Math.round(timestampMs / 60000);
      const hoursTotal = Math.floor(minsTotal / 60);
      const minsInHour = minsTotal % 60;
-      return minsTotal > 60
+      return minsTotal >= 60
-        ? this.$t('journal.hours', { hours: hoursTotal, minutes: minsInHour })
+        ? `${this.$t('journal.hours', { value: hoursTotal }, hoursTotal)} ${this.$t(
-        : this.$t('journal.minutes', { minutes: minsTotal });
+            'journal.minutes',
            { value: minsInHour },
            minsInHour
          )}`
        : showSeconds && secondsTotal <= 60
        ? this.$t('journal.seconds', { value: secondsTotal }, secondsTotal)
        : this.$t('journal.minutes', { value: minsTotal }, minsTotal);
    },
  },
 });
@@ -0,0 +1,24 @@
 import { defineComponent } from 'vue';
 export default defineComponent({
  data: () => ({
    observer: null as IntersectionObserver | null,
    observerTarget: null as Element | null,
  }),
  methods: {
    mountObserver(actionFunction: () => void, target: Element) {
      this.observer = new IntersectionObserver((entries) => {
        if (entries[0].intersectionRatio > 0) actionFunction();
      });
      this.observer.observe(target);
    },
    unmountObserver() {
      if (!this.observerTarget) return;
      this.observer?.unobserve(this.observerTarget);
    },
  },
 });
@@ -6,7 +6,7 @@ export default defineComponent({
      const bgColor = exp > -1 ? (exp < 2 ? '#26B0D9' : `hsl(${-exp * 5 + 100},  85%, 50%)`) : '#666';
      const fontColor = exp > 14 || exp == -1 ? 'white' : 'black';
-      const boxShadow = isSupporter ? `box-shadow: 0 0 10px 2px ${bgColor};` : '';
+      const boxShadow = isSupporter ? `box-shadow: 0 0 6px 2px ${bgColor};` : '';
      return `background-color: ${bgColor}; color: ${fontColor}; ${boxShadow};`;
    },
@@ -14,7 +14,7 @@ export default defineComponent({
    calculateTextExpStyle(exp: number, isSupporter = false): string {
      const textColor = exp > -1 ? (exp < 2 ? '#26B0D9' : `hsl(${-exp * 5 + 100},  75%, 50%)`) : '#666';
-      return `color: ${textColor}; ${isSupporter ? 'text-shadow: 0 0 10px ' + textColor : ''};`;
+      return `color: ${textColor}; ${isSupporter ? 'text-shadow: 0 0 6px ' + textColor : ''};`;
    },
    statusClasses(occupiedTo: string) {
@@ -0,0 +1,49 @@
 import Filter from "../../interfaces/Filter";
 export const filterInitStates: Filter = {
  default: false,
  notDefault: false,
  real: false,
  fictional: false,
  SPK: false,
  SCS: false,
  SPE: false,
  SUP: false,
  noSUP: false,
  ręczne: false,
  'ręczne+SPK': false,
  'ręczne+SCS': false,
  mechaniczne: false,
  'mechaniczne+SPK': false,
  'mechaniczne+SCS': false,
  współczesna: false,
  kształtowa: false,
  historyczna: false,
  mieszana: false,
  SBL: false,
  PBL: false,
  minLevel: 0,
  maxLevel: 20,
  minOneWayCatenary: 0,
  minOneWay: 0,
  minTwoWayCatenary: 0,
  minTwoWay: 0,
  'include-selected': false,
  'no-1track': false,
  'no-2track': false,
  free: true,
  occupied: false,
  ending: false,
  nonPublic: false,
  unavailable: true,
  abandoned: true,
  afkStatus: false,
  endingStatus: false,
  noSpaceStatus: false,
  unavailableStatus: false,
  unsignedStatus: false,
  authors: '',
  onlineFromHours: 0,
 };
@@ -0,0 +1,5 @@
 export const headIds = ['station', 'min-lvl', 'status', 'dispatcher', 'dispatcher-lvl', 'routes', 'general'] as const;
 export const headIconsIds = ['user', 'spawn', 'timetableAll', 'timetableUnconfirmed', 'timetableConfirmed'] as const;
 export type HeadIdsTypes = typeof headIds[number] | typeof headIconsIds[number];
@@ -1,6 +1,14 @@
 export const enum JournalFilterType {
-    active = "active",
+  ACTIVE = 'active',
-    fulfilled = "fulfilled",
+  FULFILLED = 'fulfilled',
-    abandoned = "abandoned",
+  ABANDONED = 'abandoned',
-    all = "all"
+  ALL = 'all',
  TWR = 'twr',
  SKR = 'skr',
  TWR_SKR = 'twr-skr',
 }
 export enum JournalFilterSection {
  TIMETABLE_STATUS = 'timetable-status',
  TWRSKR = 'twrskr',
 }
@@ -1,9 +1,21 @@
-export const enum TrainFilterType {
+export enum TrainFilterSection {
-    comments = "comments",
+  TRAIN_TYPE = 'TRAIN_TYPE',
-    twr = "twr",
+  TIMETABLE_TYPE = 'TIMETABLE_TYPE',
-    skr = "skr",
+  COMMENTS = 'COMMENTS',
-    passenger = "passenger",
+  TIMETABLE = 'TIMETABLE',
-    freight = "freight",
+}
-    other = "other",
+
-    noTimetable = "noTimetable"
+export const enum TrainFilterType {
  noComments = 'noComments',
  withComments = 'withComments',
  twr = 'twr',
  skr = 'skr',
  common = 'common',
  passenger = 'passenger',
  freight = 'freight',
  other = 'other',
  noTimetable = 'noTimetable',
  withTimetable = 'withTimetable',
 }
@@ -1,16 +1,22 @@
 export default interface Filter {
-  [key: string]: (boolean | number | string),
+  [key: string]: boolean | number | string;
  default: boolean;
  notDefault: boolean;
  real: boolean;
  fictional: boolean;
-  "SPK": boolean;
+  SPK: boolean;
-  "SCS": boolean;
+  SCS: boolean;
-  "SPE": boolean;
+  SPE: boolean;
-  "SUP": boolean;
+  SUP: boolean;
  noSUP: boolean;
  ręczne: boolean;
  'ręczne+SPK': boolean;
  'ręczne+SCS': boolean;
  mechaniczne: boolean;
-  "SBL": boolean;
+  'mechaniczne+SPK': boolean;
  'mechaniczne+SCS': boolean;
  SBL: boolean;
  PBL: boolean;
  współczesna: boolean;
  kształtowa: boolean;
  historyczna: boolean;
@@ -1,6 +1,15 @@
-import TrainStop from "./TrainStop";
+import TrainStop from './TrainStop';
-export default interface ScheduledTrain {
+export enum StopStatus {
  'arriving' = 'arriving',
  'departed' = 'departed',
  'departed-away' = 'departed-away',
  'online' = 'online',
  'stopped' = 'stopped',
  'terminated' = 'terminated',
 }
 export interface ScheduledTrain {
  trainId: string;
  trainNo: number;
@@ -27,6 +36,6 @@ export default interface ScheduledTrain {
  connectedTrack: string;
  stopLabel: string;
-    stopStatus: string;
+  stopStatus: StopStatus;
  stopStatusID: number;
 }
@@ -1,5 +1,5 @@
-import { Availability } from '../../store/storeTypes';
+import { Availability } from './store/storeTypes';
-import ScheduledTrain from './ScheduledTrain';
+import {ScheduledTrain} from './ScheduledTrain';
 import StationRoutes from './StationRoutes';
 export default interface Station {
@@ -8,12 +8,15 @@ export default interface Station {
  generalInfo?: {
    name: string;
    url: string;
    abbr: string;
    reqLevel: number;
    // supportersOnly: boolean;
    lines: string;
    project: string;
    projectUrl?: string;
    signalType: string;
    controlType: string;
@@ -38,7 +41,7 @@ export default interface Station {
    maxUsers: number;
    currentUsers: number;
-    spawns: { spawnName: string; spawnLength: number }[];
+    spawns: { spawnName: string; spawnLength: number; isElectrified: boolean }[];
    dispatcherRate: number;
    dispatcherName: string;
    dispatcherExp: number;
@@ -1,12 +1,13 @@
 export default interface StationRoutes {
-    oneWay:
+  oneWay: {
    {
    name: string;
    catenary: boolean;
    SBL: boolean;
    TWB: boolean;
    isInternal: boolean;
    tracks: number;
    speed: number;
    length: number;
  }[];
  twoWay: {
@@ -16,6 +17,8 @@ export default interface StationRoutes {
    TWB: boolean;
    isInternal: boolean;
    tracks: number;
    speed: number;
    length: number;
  }[];
  /* [catenary, noCatenary] */
@@ -0,0 +1,7 @@
 import { TrainFilterSection, TrainFilterType } from '../../enums/TrainFilterType'
 export interface TrainFilter {
  id: TrainFilterType;
  section: TrainFilterSection;
  isActive: boolean;
 }
@@ -5,6 +5,7 @@ export interface DispatcherHistory {
  dispatcherId: number;
  dispatcherName: string;
  dispatcherLevel: number | null;
  dispatcherRate: number;
  dispatcherIsSupporter: boolean;
  isOnline: boolean;
  lastOnlineTimestamp: number;
@@ -14,6 +14,17 @@ export interface ITimetablesDailyStats {
    name: string;
    count: number;
  }[];
  mostActiveDrivers: {
    name: string;
    distance: number;
  }[];
  longestDuties: {
    name: string;
    duration: number;
    station: string;
  }[];
 }
 export interface ITimetablesDailyStatsResponse {
@@ -26,5 +37,16 @@ export interface ITimetablesDailyStatsResponse {
    name: string;
    count: number;
  }[];
  mostActiveDrivers: {
    name: string;
    distance: number;
  }[];
  longestDuties: {
    name: string;
    duration: number;
    station: string;
  }[];
 }
@@ -1,5 +1,7 @@
 export interface TimetableHistory {
  id: number;
  createdAt: string;
  updatedAt: string;
  timetableId: number;
  trainNo: number;
@@ -14,6 +16,7 @@ export interface TimetableHistory {
  twr: number;
  skr: number;
  sceneriesString: string;
  currentLocation: string[];
  routeDistance: number;
  currentDistance: number;
@@ -33,7 +36,11 @@ export interface TimetableHistory {
  authorName?: string;
  authorId?: number;
  stopsString?: string;
  stockString?: string;
  stockHistory: string[];
  stockMass?: number;
  stockLength?: number;
  maxSpeed?: number;
@@ -41,10 +48,20 @@ export interface TimetableHistory {
  hashesString?: string;
  currentSceneryName?: string;
  currentSceneryHash?: string;
  routeSceneries?: string;
  checkpointArrivals?: string[];
  checkpointDepartures?: string[];
  checkpointArrivalsScheduled?: string[];
  checkpointDeparturesScheduled?: string[];
  checkpointStopTypes?: string[];
 }
 export interface SceneryTimetableHistory {
-  sceneryTimetables: TimetableHistory[];
+  timetables: TimetableHistory[];
-  totalCount: number;
+  // totalCount: number;
-  sceneryName: string;
+  // sceneryName: string;
 }
@@ -0,0 +1,23 @@
 import { JournalTimetableSorter } from '../../types/JournalTimetablesTypes';
 export interface TimetablesQueryParams {
  driverName?: string;
  trainNo?: string;
  timetableId?: string;
  authorName?: string;
  timestampFrom?: number;
  timestampTo?: number;
  issuedFrom?: string;
  countFrom?: number;
  countLimit?: number;
  fulfilled?: number;
  terminated?: number;
  twr?: number;
  skr?: number;
  sortBy?: JournalTimetableSorter['id'];
 }
@@ -1,35 +1,4 @@
-export default interface TrainAPIData {
+export interface TimetableStop {
  trainNo: number;
  mass: number;
  length: number;
  speed: number;
  stockString: string;
  signal: string;
  distance: number;
  connectedTrack: string;
  driverName: string;
  driverId: number;
  driverIsSupporter: boolean;
  driverLevel?: number;
  currentStationName: string;
  currentStationHash: string;
  online: boolean;
  lastSeen: number;
  region: string;
  isTimeout: boolean;
  timetable?: {
    timetableId: number;
    category: string;
    route: string;
    stopList: {
  stopName: string;
  stopNameRAW: string;
  stopType: string;
@@ -55,10 +24,45 @@ export default interface TrainAPIData {
  confirmed: boolean;
  stopped: boolean;
  stopTime: number;
-    }[];
+}
 export interface TrainTimetable {
  timetableId: number;
  category: string;
  route: string;
  stopList: TimetableStop[];
  TWR: boolean;
  SKR: boolean;
  sceneries: string[];
-  };
+}
 export interface TrainAPIData {
  trainNo: number;
  mass: number;
  length: number;
  speed: number;
  stockString: string;
  signal: string;
  distance: number;
  connectedTrack: string;
  driverName: string;
  driverId: number;
  driverIsSupporter: boolean;
  driverLevel?: number;
  currentStationName: string;
  currentStationHash: string;
  online: boolean;
  lastSeen: number;
  region: string;
  isTimeout: boolean;
  timetable?: TrainTimetable;
 }
@@ -1,11 +1,11 @@
 import { Socket } from 'socket.io-client';
-import { DataStatus } from '../scripts/enums/DataStatus';
+import { DataStatus } from '../../enums/DataStatus';
-import StationAPIData from '../scripts/interfaces/api/StationAPIData';
+import StationAPIData from '../api/StationAPIData';
-import TrainAPIData from '../scripts/interfaces/api/TrainAPIData';
+import { TrainAPIData } from '../api/TrainAPIData';
-import Station from '../scripts/interfaces/Station';
+import Station from '../Station';
-import Train from '../scripts/interfaces/Train';
+import Train from '../Train';
-import { DispatcherStatsAPIData } from '../scripts/interfaces/api/DispatcherStatsAPIData';
+import { DispatcherStatsAPIData } from '../api/DispatcherStatsAPIData';
-import { DriverStatsAPIData } from '../scripts/interfaces/api/DriverStatsAPIData';
+import { DriverStatsAPIData } from '../api/DriverStatsAPIData';
 export type Availability = 'default' | 'unavailable' | 'nonPublic' | 'abandoned' | 'nonDefault';
@@ -34,7 +34,7 @@ export interface StoreState {
  chosenModalTrainId?: string;
-  currentStatsTab: 'daily' | 'driver';
+  currentStatsTab: 'daily' | 'driver' | null;
  dataStatuses: {
    connection: DataStatus;
@@ -55,11 +55,23 @@ export interface APIData {
  connectedSocketCount: number;
 }
 export interface StationRoutesInfo {
  routeName: string;
  isElectric: boolean;
  isInternal: boolean;
  isRouteSBL: boolean;
  routeLength: number;
  routeSpeed: number;
  routeTracks: number;
 }
 export interface StationJSONData {
  name: string;
  abbr: string;
  url: string;
  lines: string;
  project: string;
  projectUrl: string;
  reqLevel: number;
@@ -68,7 +80,9 @@ export interface StationJSONData {
  SUP: boolean;
-  routes: string;
+  // routes: string;
  routesInfo: StationRoutesInfo[];
  checkpoints: string | null;
  authors?: string;
@@ -1,4 +1,4 @@
-import { TrainFilter } from '../../types/Trains/TrainOptionsTypes';
+import { TrainFilter } from '../interfaces/Trains/TrainFilter';
 import { TrainFilterType } from '../enums/TrainFilterType';
 import Train from '../interfaces/Train';
 import TrainStop from '../interfaces/TrainStop';
@@ -24,26 +24,36 @@ function filterTrainList(trainList: Train[], searchedTrain: string, searchedDriv
    const isFiltered = filters.every((f) => {
      if (f.isActive) return true;
      if (!train.timetableData) return filters.find((filter) => filter.id == TrainFilterType.noTimetable)!.isActive;
      switch (f.id) {
-        case TrainFilterType.comments:
+        case TrainFilterType.noTimetable:
-          return !train.timetableData.followingStops.some((stop) => stop.comments);
+          return train.timetableData;
        case TrainFilterType.withTimetable:
          return !train.timetableData;
        case TrainFilterType.withComments:
          return !train.timetableData?.followingStops.some((stop) => stop.comments);
        case TrainFilterType.noComments:
          return train.timetableData?.followingStops.some((stop) => stop.comments);
        case TrainFilterType.twr:
-          return !train.timetableData.TWR;
+          return !train.timetableData?.TWR;
        case TrainFilterType.skr:
-          return !train.timetableData.SKR;
+          return !train.timetableData?.SKR;
        case TrainFilterType.common:
          return train.timetableData?.SKR || train.timetableData?.TWR;
        case TrainFilterType.passenger:
-          return !/^[AMRE]\D{2}$/.test(train.timetableData.category);
+          return !/^[AMRE]\D{2}$/.test(train.timetableData?.category || '');
        case TrainFilterType.freight:
-          return !train.timetableData.category.startsWith('T');
+          return !train.timetableData?.category.startsWith('T');
        case TrainFilterType.other:
-          return !/^[PXZL]\D{2}$/.test(train.timetableData.category);
+          return !/^[PXZL]\D{2}$/.test(train.timetableData?.category || '');
        default:
          return true;
@@ -53,7 +63,7 @@ function filterTrainList(trainList: Train[], searchedTrain: string, searchedDriv
    return (
      (searchedTrain.length > 0 ? train.trainNo.toString().startsWith(searchedTrain) : true) &&
      (searchedDriver.length > 0 ? train.driverName.toLowerCase().startsWith(searchedDriver.toLowerCase()) : true) &&
-      (!train.timetableData ? !train.online : true) &&
+      (!train.timetableData ? train.online : train.timetableData) &&
      isFiltered
    );
  });
@@ -71,7 +81,7 @@ function sortTrainList(trainList: Train[], sorterActive: { id: string; dir: numb
        if (a.mass > b.mass) return sorterActive.dir;
        return -sorterActive.dir;
-      case 'distance':
+      case 'routeDistance':
        if ((a.timetableData?.routeDistance || -1) > (b.timetableData?.routeDistance || -1)) return sorterActive.dir;
        return -sorterActive.dir;
@@ -0,0 +1,25 @@
 import { JournalFilterType } from '../../scripts/enums/JournalFilterType';
 export type JournalTimetableSearchKey =
  | 'search-driver'
  | 'search-train'
  | 'search-date'
  | 'search-dispatcher'
  | 'search-issuedFrom';
 export type JournalTimetableSorterKey = 'timetableId' | 'beginDate' | 'distance' | 'total-stops';
 export type JournalTimetableSearchType = {
  [key in JournalTimetableSearchKey]: string;
 };
 export interface JournalFilter {
  id: JournalFilterType;
  filterSection: string;
  isActive: boolean;
 }
 export interface JournalTimetableSorter {
  id: JournalTimetableSorterKey;
  dir: 'asc' | 'desc';
 }
@@ -1,5 +1,7 @@
 export const URLs = {
  stacjownikAPI:
-    import.meta.env.VITE_APP_API_DEV == 1 && !import.meta.env.PROD ? 'http://localhost:3000' : 'https://spythere.pl',
+    import.meta.env.VITE_APP_API_DEV == 1 && !import.meta.env.PROD
      ? 'http://localhost:3001'
      : 'https://spythere.pl',
  stacjownikAPIDev: 'localhost:3000',
 };
@@ -0,0 +1,156 @@
 import { HeadIdsTypes } from '../data/stationHeaderNames';
 import Filter from '../interfaces/Filter';
 import Station from '../interfaces/Station';
 export const sortStations = (a: Station, b: Station, sorter: { headerName: HeadIdsTypes; dir: number }) => {
  let diff = 0;
  switch (sorter.headerName) {
    case 'station':
      return sorter.dir == 1 ? a.name.localeCompare(b.name) : b.name.localeCompare(a.name);
    case 'min-lvl':
      diff = (a.generalInfo?.reqLevel || 0) - (b.generalInfo?.reqLevel || 0);
      break;
    case 'status':
      diff = (a.onlineInfo?.statusTimestamp || 0) - (b.onlineInfo?.statusTimestamp || 0);
      break;
    case 'dispatcher':
      if ((a.onlineInfo?.dispatcherName.toLowerCase() || '') > (b.onlineInfo?.dispatcherName.toLowerCase() || ''))
        return sorter.dir;
      if ((a.onlineInfo?.dispatcherName.toLowerCase() || '') < (b.onlineInfo?.dispatcherName.toLowerCase() || ''))
        return -sorter.dir;
      break;
    case 'dispatcher-lvl':
      diff = (a.onlineInfo?.dispatcherExp || 0) - (b.onlineInfo?.dispatcherExp || 0);
      break;
    case 'user':
      diff = (b.onlineInfo ? b.onlineInfo.currentUsers : -1) - (a.onlineInfo ? a.onlineInfo.currentUsers : -1);
      break;
    case 'spawn':
      diff = (a.onlineInfo ? a.onlineInfo.spawns.length : -1) - (b.onlineInfo ? b.onlineInfo.spawns.length : -1);
      break;
    case 'timetableConfirmed':
      diff =
        (a.onlineInfo?.scheduledTrains
          ? a.onlineInfo.scheduledTrains.filter((train) => train.stopInfo.confirmed).length
          : -1) -
        (b.onlineInfo?.scheduledTrains
          ? b.onlineInfo.scheduledTrains.filter((train) => train.stopInfo.confirmed).length
          : -1);
      break;
    case 'timetableUnconfirmed':
      diff =
        (a.onlineInfo?.scheduledTrains
          ? a.onlineInfo.scheduledTrains.filter((train) => !train.stopInfo.confirmed).length
          : -1) -
        (b.onlineInfo?.scheduledTrains
          ? b.onlineInfo.scheduledTrains.filter((train) => !train.stopInfo.confirmed).length
          : -1);
      break;
    case 'timetableAll':
      diff =
        (a.onlineInfo?.scheduledTrains ? a.onlineInfo.scheduledTrains.length : -1) -
        (b.onlineInfo?.scheduledTrains ? b.onlineInfo.scheduledTrains.length : -1);
      break;
    default:
      break;
  }
  if (diff != 0) return Math.sign(diff) * sorter.dir;
  return a.name.localeCompare(b.name);
 };
 export const filterStations = (station: Station, filters: Filter) => {
  if (!station.onlineInfo && filters['free']) return false;
  if (station.onlineInfo) {
    const { statusID, statusTimestamp } = station.onlineInfo;
    const isEnding = statusID == 'ending' && filters['endingStatus'];
    const isNotSigned = (statusID == 'not-signed' || statusID == 'unavailable') && filters['unavailableStatus'];
    const isAFK = statusID == 'brb' && filters['afkStatus'];
    const isNoSpace = statusID == 'no-space' && filters['noSpaceStatus'];
    const isOccupied = station.onlineInfo && filters['occupied'];
    const isOnlineInBounds =
      (filters['onlineFromHours'] < 8 &&
        statusTimestamp > 0 &&
        statusTimestamp <= Date.now() + filters['onlineFromHours'] * 3600000) ||
      (filters['onlineFromHours'] > 0 && statusTimestamp <= 0) ||
      (filters['onlineFromHours'] == 8 && statusID != 'no-limit');
    if (isEnding || isOnlineInBounds || isNotSigned || isAFK || isNoSpace || isOccupied) return false;
  }
  if ((station.generalInfo?.availability == 'nonPublic' || !station.generalInfo) && filters['nonPublic']) return false;
  if (station.generalInfo) {
    const { routes, availability, controlType, lines, reqLevel, signalType, SUP, authors } = station.generalInfo;
    if (availability == 'unavailable' && filters['unavailable'] && !station.onlineInfo) return false;
    if (availability == 'abandoned' && filters['abandoned'] && !station.onlineInfo) return false;
    if (availability == 'default' && filters['default']) return false;
    if (
      availability != 'default' &&
      filters['notDefault'] &&
      !(availability == 'abandoned' || availability == 'unavailable')
    )
      return false;
    if (filters['real'] && lines) return false;
    if (filters['fictional'] && !lines) return false;
    const otherAvailability =
      availability == 'nonPublic' || availability == 'unavailable' || availability == 'abandoned';
    if (reqLevel + (otherAvailability ? 1 : 0) < filters['minLevel']) return false;
    if (reqLevel + (otherAvailability ? 1 : 0) > filters['maxLevel']) return false;
    if (
      filters['no-1track'] &&
      (routes.oneWayCatenaryRouteNames.length != 0 || routes.oneWayNoCatenaryRouteNames.length != 0)
    )
      return false;
    if (
      filters['no-2track'] &&
      (routes.twoWayCatenaryRouteNames.length != 0 || routes.twoWayNoCatenaryRouteNames.length != 0)
    )
      return false;
    if (routes.oneWayCatenaryRouteNames.length < filters['minOneWayCatenary']) return false;
    if (routes.oneWayNoCatenaryRouteNames.length < filters['minOneWay']) return false;
    if (routes.twoWayCatenaryRouteNames.length < filters['minTwoWayCatenary']) return false;
    if (routes.twoWayNoCatenaryRouteNames.length < filters['minTwoWay']) return false;
    if (filters[controlType]) return false;
    if (filters[signalType]) return false;
    if (filters['SUP'] && SUP) return false;
    if (filters['noSUP'] && !SUP) return false;
    if (filters['SBL'] && routes.sblRouteNames.length > 0) return false;
    if (filters['PBL'] && routes.sblRouteNames.length == 0) return false;
    if (
      filters['authors'].length > 3 &&
      !authors?.map((a) => a.toLocaleLowerCase()).includes(filters['authors'].toLocaleLowerCase())
    )
      return false;
  }
  return true;
 };
@@ -1,4 +1,4 @@
-import ScheduledTrain from '../interfaces/ScheduledTrain';
+import { ScheduledTrain, StopStatus } from '../interfaces/ScheduledTrain';
 import Train from '../interfaces/Train';
 import TrainStop from '../interfaces/TrainStop';
@@ -66,40 +66,41 @@ export const parseSpawns = (spawnString: string) => {
    const spawnArray = spawn.split(',');
    const spawnName = spawnArray[6] ? spawnArray[6] : spawnArray[0];
    const spawnLength = parseInt(spawnArray[2]);
    const isElectrified = spawnArray[3] == 'True';
-    return { spawnName, spawnLength };
+    return { spawnName, spawnLength, isElectrified };
  });
 };
 export const getTimestamp = (date: string | null): number => (date ? new Date(date).getTime() : 0);
 export const getTrainStopStatus = (stopInfo: TrainStop, currentStationName: string, stationName: string) => {
-  let stopStatus = '',
+  let stopStatus = StopStatus['arriving'],
    stopLabel = '',
    stopStatusID = -1;
  if (stopInfo.terminatesHere && stopInfo.confirmed) {
-    stopStatus = 'terminated';
+    stopStatus = StopStatus['terminated'];
    stopLabel = 'Skończył bieg';
    stopStatusID = 5;
  } else if (!stopInfo.terminatesHere && stopInfo.confirmed && currentStationName == stationName) {
-    stopStatus = 'departed';
+    stopStatus = StopStatus['departed'];
    stopLabel = 'Odprawiony';
    stopStatusID = 2;
  } else if (!stopInfo.terminatesHere && stopInfo.confirmed && currentStationName != stationName) {
-    stopStatus = 'departed-away';
+    stopStatus = StopStatus['departed-away'];
    stopLabel = 'Odjechał';
    stopStatusID = 4;
  } else if (currentStationName == stationName && !stopInfo.stopped) {
-    stopStatus = 'online';
+    stopStatus = StopStatus['online'];
    stopLabel = 'Na stacji';
    stopStatusID = 0;
  } else if (currentStationName == stationName && stopInfo.stopped) {
-    stopStatus = 'stopped';
+    stopStatus = StopStatus['stopped'];
    stopLabel = 'Postój';
    stopStatusID = 1;
  } else if (currentStationName != stationName) {
-    stopStatus = 'arriving';
+    stopStatus = StopStatus['arriving'];
    stopLabel = 'W drodze';
    stopStatusID = 3;
  }
@@ -122,7 +123,7 @@ export function getScheduledTrain(train: Train, trainStopIndex: number, stationN
  for (let i = trainStopIndex - 1; i >= 0; i--) {
    if (/strong|podg/g.test(followingStops[i].stopName)) {
-      prevStationName = followingStops[i].stopNameRAW.replace(/,.*/g,"");
+      prevStationName = followingStops[i].stopNameRAW.replace(/,.*/g, '');
      break;
    }
@@ -130,7 +131,7 @@ export function getScheduledTrain(train: Train, trainStopIndex: number, stationN
  for (let i = trainStopIndex + 1; i < followingStops.length; i++) {
    if (/strong|podg/g.test(followingStops[i].stopName)) {
-      nextStationName = followingStops[i].stopNameRAW.replace(/,.*/g,"");
+      nextStationName = followingStops[i].stopNameRAW.replace(/,.*/g, '');
      break;
    }
@@ -172,7 +173,6 @@ export function getScheduledTrain(train: Train, trainStopIndex: number, stationN
    signal: train.signal,
    connectedTrack: train.connectedTrack,
    driverName: train.driverName,
    driverId: train.driverId,
    currentStationName: train.currentStationName,
@@ -0,0 +1,9 @@
 import { defineStore } from 'pinia';
 export const useJournalFiltersStore = defineStore('journalFiltersStore', {
  state: () => ({
    timetableFilters: {
    },
  }),
 });
@@ -1,246 +1,29 @@
 import { defineStore } from 'pinia';
 import inputData from '../data/options.json';
 import Filter from '../scripts/interfaces/Filter';
 import Station from '../scripts/interfaces/Station';
 import StorageManager from '../scripts/managers/storageManager';
 import { useStore } from './store';
-
+import { filterInitStates } from '../scripts/constants/stores/initFilterStates';
-const sortStations = (a: Station, b: Station, sorter: { index: number; dir: number }) => {
+import { filterStations, sortStations } from '../scripts/utils/filterUtils';
-  switch (sorter.index) {
+import { HeadIdsTypes } from '../scripts/data/stationHeaderNames';
    case 0:
      return sorter.dir == 1 ? a.name.localeCompare(b.name) : b.name.localeCompare(a.name);
    case 1:
      if ((a.generalInfo?.reqLevel || 0) > (b.generalInfo?.reqLevel || 0)) return sorter.dir;
      if ((a.generalInfo?.reqLevel || 0) < (b.generalInfo?.reqLevel || 0)) return -sorter.dir;
      break;
    case 2:
      if ((a.onlineInfo?.statusTimestamp || 0) > (b.onlineInfo?.statusTimestamp || 0)) return sorter.dir;
      if ((a.onlineInfo?.statusTimestamp || 0) < (b.onlineInfo?.statusTimestamp || 0)) return -sorter.dir;
      break;
    case 3:
      if ((a.onlineInfo?.dispatcherName.toLowerCase() || '') > (b.onlineInfo?.dispatcherName.toLowerCase() || ''))
        return sorter.dir;
      if ((a.onlineInfo?.dispatcherName.toLowerCase() || '') < (b.onlineInfo?.dispatcherName.toLowerCase() || ''))
        return -sorter.dir;
      break;
    case 4:
      if ((a.onlineInfo?.dispatcherExp || 0) > (b.onlineInfo?.dispatcherExp || 0)) return sorter.dir;
      if ((a.onlineInfo?.dispatcherExp || 0) < (b.onlineInfo?.dispatcherExp || 0)) return -sorter.dir;
      break;
    case 7:
      if ((a.onlineInfo?.currentUsers || 0) > (b.onlineInfo?.currentUsers || 0)) return sorter.dir;
      if ((a.onlineInfo?.currentUsers || 0) < (b.onlineInfo?.currentUsers || 0)) return -sorter.dir;
      if ((a.onlineInfo?.maxUsers || 0) > (b.onlineInfo?.maxUsers || 0)) return sorter.dir;
      if ((a.onlineInfo?.maxUsers || 0) < (b.onlineInfo?.maxUsers || 0)) return -sorter.dir;
      break;
    case 8:
      if ((a.onlineInfo?.spawns.length || 0) > (b.onlineInfo?.spawns.length || 0)) return sorter.dir;
      if ((a.onlineInfo?.spawns.length || 0) < (b.onlineInfo?.spawns.length || 0)) return -sorter.dir;
      break;
    case 9:
      if ((a.onlineInfo?.scheduledTrains?.length || 0) > (b.onlineInfo?.scheduledTrains?.length || 0))
        return sorter.dir;
      if ((a.onlineInfo?.scheduledTrains?.length || 0) < (b.onlineInfo?.scheduledTrains?.length || 0))
        return -sorter.dir;
    default:
      break;
  }
  return a.name.localeCompare(b.name);
 };
 const filterStations = (station: Station, filters: Filter, isOffline = false) => {
  const returnMode = false;
  if ((station.generalInfo?.availability == 'nonPublic' || !station.generalInfo) && filters['nonPublic'])
    return returnMode;
  if (station.onlineInfo?.statusID == 'ending' && filters['ending']) return returnMode;
  if (
    station.onlineInfo &&
    station.onlineInfo.statusTimestamp > 0 &&
    filters['onlineFromHours'] < 8 &&
    station.onlineInfo.statusTimestamp <= Date.now() + filters['onlineFromHours'] * 3600000
  )
    return returnMode;
  if (filters['onlineFromHours'] > 0 && station.onlineInfo && station.onlineInfo.statusTimestamp <= 0)
    return returnMode;
  if (filters['onlineFromHours'] == 8 && station.onlineInfo?.statusID != 'no-limit') return returnMode;
  if (station.onlineInfo?.statusID == 'ending' && filters['endingStatus']) return returnMode;
  if (
    (station.onlineInfo?.statusID == 'not-signed' || station.onlineInfo?.statusID == 'unavailable') &&
    filters['unavailableStatus']
  )
    return returnMode;
  if (station.onlineInfo?.statusID == 'brb' && filters['afkStatus']) return returnMode;
  if (station.onlineInfo?.statusID == 'no-space' && filters['noSpaceStatus']) return returnMode;
  if (station.onlineInfo && filters['occupied']) return returnMode;
  if (!station.onlineInfo && filters['free']) return returnMode;
  if (station.generalInfo?.availability == 'unavailable' && filters['unavailable'] && !station.onlineInfo)
    return returnMode;
  if (station.generalInfo) {
    const routes = station.generalInfo.routes;
    const availability = station.generalInfo.availability;
    if (filters['abandoned'] && availability == 'abandoned' && !station.onlineInfo) return returnMode;
    if (availability == 'default' && filters['default']) return returnMode;
    if (
      availability != 'default' &&
      filters['notDefault'] &&
      !(availability == 'abandoned' || availability == 'unavailable')
    )
      return returnMode;
    if (filters['real'] && station.generalInfo.lines != '') return returnMode;
    if (
      filters['fictional'] &&
      station.generalInfo.lines == '' &&
      availability != 'abandoned' &&
      availability != 'unavailable'
    )
      return returnMode;
    if (
      station.generalInfo.reqLevel +
        (availability == 'nonPublic' || availability == 'unavailable' || availability == 'abandoned' ? 1 : 0) <
      filters['minLevel']
    )
      return returnMode;
    if (
      station.generalInfo.reqLevel +
        (availability == 'nonPublic' || availability == 'unavailable' || availability == 'abandoned' ? 1 : 0) >
      filters['maxLevel']
    )
      return returnMode;
    if (
      filters['no-1track'] &&
      (routes.oneWayCatenaryRouteNames.length != 0 || routes.oneWayNoCatenaryRouteNames.length != 0)
    )
      return returnMode;
    if (
      filters['no-2track'] &&
      (routes.twoWayCatenaryRouteNames.length != 0 || routes.twoWayNoCatenaryRouteNames.length != 0)
    )
      return returnMode;
    if (routes.oneWayCatenaryRouteNames.length < filters['minOneWayCatenary']) return returnMode;
    if (routes.oneWayNoCatenaryRouteNames.length < filters['minOneWay']) return returnMode;
    if (routes.twoWayCatenaryRouteNames.length < filters['minTwoWayCatenary']) return returnMode;
    if (routes.twoWayNoCatenaryRouteNames.length < filters['minTwoWay']) return returnMode;
    if (filters[station.generalInfo.controlType]) return returnMode;
    if (filters[station.generalInfo.signalType]) return returnMode;
    if (
      filters['SPK'] &&
      (station.generalInfo.controlType === 'SPK' || station.generalInfo.controlType.includes('+SPK'))
    )
      return returnMode;
    if (
      filters['SCS'] &&
      (station.generalInfo.controlType === 'SCS' || station.generalInfo.controlType.includes('+SCS'))
    )
      return returnMode;
    if (
      filters['SPE'] &&
      (station.generalInfo.controlType === 'SPE' || station.generalInfo.controlType.includes('+SPE'))
    )
      return returnMode;
    if (filters['SUP'] && station.generalInfo.SUP) return returnMode;
    if (
      filters['SCS'] &&
      filters['SPK'] &&
      (station.generalInfo.controlType.includes('SPK') || station.generalInfo.controlType.includes('SCS'))
    )
      return returnMode;
    if (filters['mechaniczne'] && station.generalInfo.controlType.includes('mechaniczne')) return returnMode;
    if (filters['ręczne'] && station.generalInfo.controlType.includes('ręczne')) return returnMode;
    if (filters['SBL'] && routes.sblRouteNames.length > 0) return returnMode;
    if (
      filters['authors'].length > 3 &&
      !station.generalInfo.authors?.map((a) => a.toLocaleLowerCase()).includes(filters['authors'].toLocaleLowerCase())
    )
      return returnMode;
  }
  return true;
 };
 const filterInitStates: Filter = {
  default: false,
  notDefault: false,
  real: false,
  fictional: false,
  SPK: false,
  SCS: false,
  SPE: false,
  SUP: false,
  ręczne: false,
  mechaniczne: false,
  współczesna: false,
  kształtowa: false,
  historyczna: false,
  mieszana: false,
  SBL: false,
  minLevel: 0,
  maxLevel: 20,
  minOneWayCatenary: 0,
  minOneWay: 0,
  minTwoWayCatenary: 0,
  minTwoWay: 0,
  'include-selected': false,
  'no-1track': false,
  'no-2track': false,
  free: true,
  occupied: false,
  ending: false,
  nonPublic: false,
  unavailable: true,
  abandoned: true,
  afkStatus: false,
  endingStatus: false,
  noSpaceStatus: false,
  unavailableStatus: false,
  unsignedStatus: false,
  authors: '',
  onlineFromHours: 0,
 };
 export const useStationFiltersStore = defineStore('stationFiltersStore', {
  state() {
    return {
      inputs: inputData,
      filters: { ...filterInitStates },
-      sorterActive: { index: 0, dir: 1 },
+      sorterActive: { headerName: 'station' as HeadIdsTypes, dir: 1 },
      store: useStore(),
      lastClickedFilterId: '',
    };
  },
  getters: {
    areFiltersAtDefault(state) {
      return Object.keys(state.filters).every((f) => state.filters[f] === filterInitStates[f]);
    },
  },
  actions: {
    getFilteredStationList(stationList: Station[], region: string): Station[] {
      return stationList
@@ -251,7 +34,7 @@ export const useStationFiltersStore = defineStore('stationFiltersStore', {
          return station;
        })
-        .filter((station) => filterStations(station, this.filters, this.store.isOffline))
+        .filter((station) => filterStations(station, this.filters))
        .sort((a, b) => sortStations(a, b, this.sorterActive));
    },
@@ -259,10 +42,10 @@ export const useStationFiltersStore = defineStore('stationFiltersStore', {
      if (!StorageManager.isRegistered('options_saved')) return;
      this.inputs.options.forEach((option) => {
-        if (!StorageManager.isRegistered(option.id)) return;
+        if (!StorageManager.isRegistered(option.name)) return;
-        const savedValue = StorageManager.getBooleanValue(option.id);
+        const savedValue = StorageManager.getBooleanValue(option.name);
-        this.filters[option.id] = savedValue;
+        this.filters[option.name] = savedValue;
        option.value = !savedValue;
      });
@@ -295,14 +78,22 @@ export const useStationFiltersStore = defineStore('stationFiltersStore', {
      });
    },
-    changeSorter(index: number) {
+    resetSectionOptions(section: string) {
-      if (index > 4 && index < 7) return;
+      this.inputs.options.forEach((option) => {
        if (option.section != section) return;
-      if (index == this.sorterActive.index) this.sorterActive.dir = -1 * this.sorterActive.dir;
+        option.value = option.defaultValue;
        this.filters[option.id] = !option.defaultValue;
        StorageManager.setBooleanValue(option.name, !option.defaultValue);
      });
    },
    changeSorter(headerName: HeadIdsTypes) {
      if (headerName == this.sorterActive.headerName) this.sorterActive.dir = -1 * this.sorterActive.dir;
      else this.sorterActive.dir = 1;
-      this.sorterActive.index = index;
+      this.sorterActive.headerName = headerName;
    },
  },
 });
@@ -3,7 +3,7 @@ import { defineStore } from 'pinia';
 import { io } from 'socket.io-client';
 import { DataStatus } from '../scripts/enums/DataStatus';
 import StationAPIData from '../scripts/interfaces/api/StationAPIData';
-import ScheduledTrain from '../scripts/interfaces/ScheduledTrain';
+import { ScheduledTrain } from '../scripts/interfaces/ScheduledTrain';
 import Station from '../scripts/interfaces/Station';
 import StationRoutes from '../scripts/interfaces/StationRoutes';
 import Train from '../scripts/interfaces/Train';
@@ -15,7 +15,7 @@ import {
  getScheduledTrain,
  parseSpawns,
 } from '../scripts/utils/storeUtils';
-import { APIData, StationJSONData, StoreState } from './storeTypes';
+import { APIData, StationJSONData, StoreState } from '../scripts/interfaces/store/storeTypes';
 export const useStore = defineStore('store', {
  state: () =>
@@ -24,6 +24,7 @@ export const useStore = defineStore('store', {
      stationList: [],
      trainList: [],
      routesList: [],
      sceneryData: [],
      lastDispatcherStatuses: [],
@@ -53,7 +54,7 @@ export const useStore = defineStore('store', {
        trains: DataStatus.Loading,
      },
-      currentStatsTab: 'daily',
+      currentStatsTab: null,
      blockScroll: false,
      listenerLaunched: false,
@@ -115,8 +116,8 @@ export const useStore = defineStore('store', {
                  sceneries: timetable.sceneries,
                }
              : undefined,
-          };
+          } as Train;
-        }) as Train[];
+        });
    },
    getDispatcherStatus(onlineStationData: StationAPIData) {
@@ -294,47 +295,34 @@ export const useStore = defineStore('store', {
        return;
      }
-      this.stationList = sceneryData.map((scenery) => ({
+      this.stationList = sceneryData.map((scenery) => {
        return {
          name: scenery.name,
          generalInfo: {
            ...scenery,
            authors: scenery.authors?.split(',').map((a) => a.trim()),
            routes:
-            scenery.routes
+              scenery.routesInfo.reduce(
-              ?.split(';')
+                (acc, route) => {
-              .filter((routeString) => routeString)
+                  const propName: keyof StationRoutes = `${route.routeTracks == 2 ? 'twoWay' : 'oneWay'}${
-              .reduce(
+                    route.isElectric ? '' : 'No'
-                (acc, routeString) => {
+                  }CatenaryRouteNames`;
                  const specs1 = routeString.split('_')[0];
                  const isInternal = specs1.startsWith('!');
                  const name = isInternal ? specs1.replace('!', '') : specs1;
-                  const specs2 = routeString.split('_')[1].split('');
+                  acc[route.routeTracks == 2 ? 'twoWay' : 'oneWay'].push({
-                  const twoWay = specs2[0] == '2';
+                    name: route.routeName,
-                  const catenary = specs2[1] == 'E';
+                    SBL: route.isRouteSBL,
-                  const SBL = specs2[2] == 'S';
+                    TWB: false,
-                  const TWB = specs2[3] ? true : false;
+                    catenary: route.isElectric,
-
+                    isInternal: route.isInternal,
-                  const propName = twoWay
+                    tracks: route.routeTracks,
-                    ? catenary
+                    length: route.routeLength,
-                      ? 'twoWayCatenaryRouteNames'
+                    speed: route.routeSpeed,
                      : 'twoWayNoCatenaryRouteNames'
                    : catenary
                    ? 'oneWayCatenaryRouteNames'
                    : 'oneWayNoCatenaryRouteNames';
                  acc[twoWay ? 'twoWay' : 'oneWay'].push({
                    name,
                    SBL,
                    TWB,
                    catenary,
                    isInternal,
                    tracks: twoWay ? 2 : 1,
                  });
                  if (!isInternal) acc[propName].push(name);
-                  if (SBL) acc['sblRouteNames'].push(name);
+                  if (!route.isInternal) acc[propName].push(route.routeName);
                  if (route.isRouteSBL) acc['sblRouteNames'].push(route.routeName);
                  return acc;
                },
@@ -352,15 +340,15 @@ export const useStore = defineStore('store', {
              ? scenery.checkpoints.split(';').map((sub) => ({ checkpointName: sub, scheduledTrains: [] }))
              : [],
          },
-      }));
+        };
      });
    },
    connectToWebsocket() {
      const socket = io(URLs.stacjownikAPI, {
-        transports: ['websocket', 'polling'],
+        // transports: ['websocket', 'polling'],
        rememberUpgrade: true,
        reconnection: true,
        timeout: 2000,
      });
      socket.on('connect_error', (err) => {
@@ -374,8 +362,9 @@ export const useStore = defineStore('store', {
      });
      socket.emit('FETCH_DATA', {}, (data: APIData) => {
        this.apiData = data;
        this.dataStatuses.connection = DataStatus.Loaded;
        this.apiData = data;
        this.setOnlineData();
      });
@@ -23,6 +23,15 @@
  padding: 1em 0;
 }
 .journal_refreshed-date {
  background-color: #333;
  color: #ddd;
  text-align: end;
  padding: 0.25em;
  margin: 0.5em 0;
 }
 .journal_warning {
  text-align: center;
  font-size: 1.3em;
@@ -71,6 +80,10 @@
    justify-content: center;
    flex-wrap: wrap;
  }
  .journal_refreshed-date {
    text-align: center;
  }
 }
@media (orientation: landscape) {
@@ -1,11 +0,0 @@
 .scenery-section {
  position: relative;
  height: 100%;
  overflow-y: scroll;
 }
 .list-warning {
  padding: 1em 0.5em;
  background-color: #444;
  font-size: 1.2em;
 }
@@ -4,12 +4,11 @@
  display: inline-block;
  padding: 0;
  background: #585858;
  margin: 0.25em;
  span {
    display: inline-block;
    background: #585858;
    padding: 0.2em 0.4em;
  }
@@ -26,3 +25,55 @@
    }
  }
 }
 .level-badge {
  display: flex;
  justify-content: center;
  align-items: center;
  &.driver {
    border-radius: 50%;
    width: 1.7em;
    height: 1.7em;
  }
  &.dispatcher {
    border-radius: 0.25em;
    width: 1.6em;
    height: 1.6em;
  }
 }
 .region-badge {
  padding: 0 0.5em;
  border-radius: 0.5em;
  font-weight: bold;
  &.eu {
    background-color: forestgreen;
  }
 }
 .train-badge {
  padding: 0.1em 0.2em;
  border-radius: 0.2em;
  font-weight: bold;
  font-size: 0.9em;
  &.twr {
    background-color: var(--clr-twr);
    box-shadow: 0 0 5px 1px var(--clr-twr);
    color: black;
  }
  &.skr {
    background-color: var(--clr-skr);
    box-shadow: 0 0 5px 1px var(--clr-skr);
  }
  &.offline {
    background-color: #be3728;
  }
 }
@@ -21,17 +21,16 @@
  transform: translate(-50%, -50%);
-  overflow-x: hidden;
+  overflow: hidden;
-  background: #202020da;
+  background: #202020e8;
-  box-shadow: 0 0 15px 5px #303030;
+  box-shadow: 0 0 15px 0 black;
  border: 1px solid #202020e8;
-  width: 600px;
+  width: 95%;
  max-width: 700px;
-  @include smallScreen {
+  max-height: 95vh;
    width: 100%;
    height: 80vh;
  }
  &-exit {
    position: absolute;
@@ -46,3 +45,9 @@
    cursor: pointer;
  }
 }
@include smallScreen {
  .card {
    max-height: 85vh;
  }
 }
@@ -67,7 +67,7 @@ h1.option-title {
  box-shadow: 0 5px 10px 2px #0f0f0f;
  width: 97%;
-  max-width: 500px;
+  max-width: 550px;
  padding: 1em;
  z-index: 100;
@@ -77,24 +77,30 @@ h1.option-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5em;
  padding: 0.25em 0.25em 0 0;
 }
 .options_filter-sections section {
  margin: 0.5em 0;
 }
 .options_filters {
  display: flex;
  flex-wrap: wrap;
-  margin: 0.5em 0 0 0;
+
  gap: 0.5em;
  margin: 0.25em 0;
 }
 .sort-option,
 .filter-option {
-  margin: 0.25em 0.25em 0.25em 0;
+  padding: 0.25em 0.5em;
 }
 .sort-option[data-selected='true'] {
  color: $accentCol;
  font-weight: bold;
 }
 .filter-option {
@@ -116,17 +122,6 @@ h1.option-title {
    margin: 0.5em auto;
  }
  .search_actions {
    display: flex;
    gap: 0.5em;
    margin: 1em 0;
    width: 100%;
    button {
      width: 100%;
    }
  }
  .search-box {
    .search-exit {
      position: absolute;
@@ -137,6 +132,17 @@ h1.option-title {
  }
 }
 .options_actions {
  display: flex;
  gap: 0.5em;
  width: 100%;
  margin-top: 1em;
  button {
    width: 100%;
  }
 }
@include smallScreen() {
  h1 {
    text-align: center;
@@ -153,13 +159,12 @@ h1.option-title {
    max-width: 100%;
  }
  .filter-option,
  .sort-option {
    margin: 0.25em 0.25em;
  }
  .options_filters,
  .options_sorters {
    justify-content: center;
  }
  .filter-section {
    text-align: center;
  }
 }
@@ -18,19 +18,21 @@
 }
 ::-webkit-scrollbar {
-  width: 1rem;
+  width: 15px;
-  height: 1rem;
+  height: 15px;
  background-color: transparent;
  &-track {
    border-radius: 0.5em;
    background-color: #333;
  }
  &-thumb {
    border-radius: 0.5em;
    background-color: #666;
  }
  &-corner {
    background-color: #333;
  }
 }
 html {
@@ -43,11 +45,12 @@ body {
  margin: 0;
  padding: 0;
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  overflow-y: scroll;
  &.no-scroll {
    overflow-y: hidden;
-    padding-right: 1rem;
+    padding-right: 15px;
    @include smallScreen() {
      padding: 0;
@@ -79,22 +82,9 @@ body {
    transition: opacity 0.3s;
    padding: 0.25em;
    // @include smallScreen() {
    //   right: 0;
    //   left: 0;
    //   &::after {
    //     left: 75%;
    //   }
    // }
  }
  &:hover > .content {
    // @include smallScreen() {
    //   display: none;
    // }
    visibility: visible;
    opacity: 1;
  }
@@ -103,7 +93,6 @@ body {
 button,
 input,
 select {
  // font-family: "Open Sans", sans-serif;
  border: none;
  font-family: 'Quicksand', sans-serif;
  font-size: 1em;
@@ -213,10 +202,6 @@ button {
    pointer-events: none;
    opacity: 0.85;
  }
  &[data-inactive='true'] {
    opacity: 0.55;
  }
 }
 button.btn--filled {
@@ -0,0 +1,31 @@
 table.scenery-history-table {
  width: 100%;
  border-collapse: collapse;
  thead {
    position: sticky;
    top: 0;
    background-color: #222222;
  }
  th {
    padding: 0.5em;
  }
  tr {
    background-color: #353535;
    border: none;
  }
  td {
    padding: 0.75em;
    border-bottom: solid 5px #111;
  }
 }
 .no-history {
  padding: 1em 0.5em;
  background-color: #444;
  font-size: 1.2em;
  color: #ccc;
 }
@@ -1,18 +0,0 @@
 import { JournalFilterType } from '../../scripts/enums/JournalFilterType';
 export type JournalTimetableSearchKey = 'search-driver' | 'search-train' | 'search-date' | 'search-dispatcher'; 
 export type JournalTimetableSearchType = {
  [key in JournalTimetableSearchKey]: string;
 };
 export interface JournalTimetableFilter {
  id: JournalFilterType;
  filterSection: string;
  isActive: boolean;
 }
 export interface JournalTimetableSorter {
  id:  'timetableId' | 'beginDate' | 'distance' | 'total-stops';
  dir: -1 | 1;
 }
@@ -1,6 +0,0 @@
 import { TrainFilterType } from "../../scripts/enums/TrainFilterType";
 export interface TrainFilter {
  id: TrainFilterType;
  isActive: boolean;
 }
@@ -10,8 +10,13 @@
        :sorter-option-ids="['timestampFrom', 'duration']"
        :data-status="dataStatus"
        :current-options-active="currentOptionsActive"
        optionsType="dispatchers"
      />
      <div class="journal_refreshed-date" v-if="dataRefreshedAt">
        {{ $t('journal.data-refreshed-at') }}: {{ dataRefreshedAt.toLocaleString($i18n.locale) }}
      </div>
      <div class="list_wrapper" @scroll="handleScroll">
        <transition name="status-anim" mode="out-in">
          <div :key="dataStatus">
@@ -19,7 +24,7 @@
              {{ $t('app.offline') }}
            </div>
-            <Loading v-else-if="dataStatus == DataStatus.Initialized || dataStatus == DataStatus.Loading" />
+            <Loading v-else-if="dataStatus == DataStatus.Loading" />
            <div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
              {{ $t('app.error') }}
@@ -69,7 +74,7 @@ import { URLs } from '../scripts/utils/apiURLs';
 import { DataStatus } from '../scripts/enums/DataStatus';
 import { useStore } from '../store/store';
 import JournalDispatchersList from '../components/JournalView/JournalDispatchersList.vue';
-import { JournalDispatcherSearcher, JournalDispatcherSorter } from '../types/Journal/JournalDispatcherTypes';
+import { JournalDispatcherSearcher, JournalDispatcherSorter } from '../scripts/types/JournalDispatcherTypes';
 import { DispatcherHistory } from '../scripts/interfaces/api/DispatchersAPIData';
 import JournalHeader from '../components/JournalView/JournalHeader.vue';
 import { LocationQuery } from 'vue-router';
@@ -103,6 +108,7 @@ export default defineComponent({
  data: () => ({
    currentQuery: '',
    currentQueryArray: [] as string[],
    dataRefreshedAt: null as Date | null,
    scrollDataLoaded: true,
    scrollNoMoreData: false,
@@ -111,7 +117,7 @@ export default defineComponent({
    statsCardOpen: false,
    currentOptionsActive: false,
-    dataStatus: DataStatus.Initialized,
+    dataStatus: DataStatus.Loading,
    DataStatus,
    historyList: [] as DispatcherHistory[],
@@ -133,6 +139,7 @@ export default defineComponent({
    provide('sorterActive', sorterActive);
    provide('journalFilterActive', journalFilterActive);
    provide('searchersValues', searchersValues);
    provide('filterList', reactive([]));
    const scrollElement: Ref<HTMLElement | null> = ref(null);
@@ -271,6 +278,7 @@ export default defineComponent({
            ? this.historyList[0].dispatcherName
            : '';
        this.dataRefreshedAt = new Date();
        this.dataStatus = DataStatus.Loaded;
      } catch (error) {
        this.dataStatus = DataStatus.Error;
@@ -286,4 +294,3 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../styles/JournalSection.scss';
 </style>
@@ -7,14 +7,19 @@
        @on-search-confirm="fetchHistoryData"
        @on-options-reset="resetOptions"
        @on-refresh-data="fetchHistoryData"
-        :sorter-option-ids="['timetableId', 'beginDate', 'distance', 'total-stops']"
+        :sorter-option-ids="['timetableId', 'beginDate', 'routeDistance', 'allStopsCount']"
        :filters="journalTimetableFilters"
        :currentOptionsActive="currentOptionsActive"
        :data-status="dataStatus"
        optionsType="timetables"
      />
      <JournalStats />
      <div class="journal_refreshed-date" v-if="dataRefreshedAt">
        {{ $t('journal.data-refreshed-at') }}: {{ dataRefreshedAt.toLocaleString($i18n.locale) }}
      </div>
      <div class="list_wrapper" @scroll="handleScroll">
        <transition name="status-anim" mode="out-in">
          <div :key="dataStatus">
@@ -22,7 +27,7 @@
              {{ $t('app.offline') }}
            </div>
-            <Loading v-else-if="dataStatus == DataStatus.Initialized || dataStatus == DataStatus.Loading" />
+            <Loading v-else-if="dataStatus == DataStatus.Loading" />
            <div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
              {{ $t('app.error') }}
@@ -57,25 +62,32 @@
 import { defineComponent, provide, reactive, Ref, ref } from 'vue';
 import axios from 'axios';
-import DriverStats from '../components/JournalView/JournalDriverStats.vue';
+import imageMixin from '../mixins/imageMixin';
 import Loading from '../components/Global/Loading.vue';
 import { JournalTimetableSorter } from '../types/Journal/JournalTimetablesTypes';
 import dateMixin from '../mixins/dateMixin';
 import routerMixin from '../mixins/routerMixin';
 import modalTrainMixin from '../mixins/modalTrainMixin';
 import DriverStats from '../components/JournalView/JournalDriverStats.vue';
 import JournalOptions from '../components/JournalView/JournalOptions.vue';
 import JournalStats from '../components/JournalView/JournalStats.vue';
 import JournalHeader from '../components/JournalView/JournalHeader.vue';
 import JournalTimetablesList from '../components/JournalView/JournalTimetablesList.vue';
 import Loading from '../components/Global/Loading.vue';
 import { DataStatus } from '../scripts/enums/DataStatus';
 import { JournalFilterType } from '../scripts/enums/JournalFilterType';
 import { TimetableHistory } from '../scripts/interfaces/api/TimetablesAPIData';
 import { URLs } from '../scripts/utils/apiURLs';
 import { useStore } from '../store/store';
-import JournalOptions from '../components/JournalView/JournalOptions.vue';
+
 import { JournalTimetableSearchType } from '../types/Journal/JournalTimetablesTypes';
 import modalTrainMixin from '../mixins/modalTrainMixin';
 import imageMixin from '../mixins/imageMixin';
 import JournalTimetablesList from '../components/JournalView/JournalTimetablesList.vue';
 import { journalTimetableFilters } from '../constants/Journal/JournalTimetablesConsts';
 import JournalStats from '../components/JournalView/JournalStats.vue';
 import JournalHeader from '../components/JournalView/JournalHeader.vue';
 import { LocationQuery } from 'vue-router';
 import { TimetablesQueryParams } from '../scripts/interfaces/api/TimetablesQueryParams';
 import { JournalFilterType } from '../scripts/enums/JournalFilterType';
 import {
  JournalFilter,
  JournalTimetableSearchType,
  JournalTimetableSorter,
 } from '../scripts/types/JournalTimetablesTypes';
 import { journalTimetableFilters } from '../constants/Journal/JournalTimetablesConsts';
 const TIMETABLES_API_URL = `${URLs.stacjownikAPI}/api/getTimetables`;
@@ -92,8 +104,8 @@ export default defineComponent({
  },
  data: () => ({
-    currentQuery: '',
+    currentQueryParams: {} as TimetablesQueryParams,
-    currentQueryArray: [] as string[],
+    dataRefreshedAt: null as Date | null,
    scrollDataLoaded: true,
    scrollNoMoreData: false,
@@ -105,20 +117,23 @@ export default defineComponent({
    timetableHistory: [] as TimetableHistory[],
    journalTimetableFilters,
-    dataStatus: DataStatus.Initialized,
+    dataStatus: DataStatus.Loading,
    dataErrorMessage: '',
    DataStatus,
  }),
  setup() {
-    const sorterActive: JournalTimetableSorter = reactive({ id: 'timetableId', dir: 1 });
+    const sorterActive: JournalTimetableSorter = reactive({ id: 'timetableId', dir: 'desc' });
-    const journalFilterActive = ref(journalTimetableFilters[0]);
+    // const journalFilterActive = ref(journalTimetableFilters[0]);
    const initFilters: readonly JournalFilter[] = JSON.parse(JSON.stringify(journalTimetableFilters));
    const filterList: JournalFilter[] = reactive(JSON.parse(JSON.stringify(initFilters)));
    const searchersValues = reactive({
      'search-train': '',
      'search-driver': '',
      'search-dispatcher': '',
      'search-issuedFrom': '',
      'search-date': '',
    } as JournalTimetableSearchType);
@@ -127,14 +142,15 @@ export default defineComponent({
    provide('searchersValues', searchersValues);
    provide('sorterActive', sorterActive);
-    provide('journalFilterActive', journalFilterActive);
+    provide('filterList', filterList);
    const scrollElement: Ref<HTMLElement | null> = ref(null);
    return {
      sorterActive,
      journalFilterActive,
      searchersValues,
      filterList,
      initFilters,
      countFromIndex,
      countLimit,
@@ -146,8 +162,8 @@ export default defineComponent({
  },
  watch: {
-    currentQueryArray(q: string[]) {      
+    currentQueryParams(q: TimetablesQueryParams) {
-      this.currentOptionsActive = q.length >= 2 || q.some((qv) => qv.startsWith('sortBy=') && qv.split('=')[1]);
+      this.currentOptionsActive = Object.values(q).some((v) => v !== undefined);
    },
  },
@@ -162,7 +178,6 @@ export default defineComponent({
    this.fetchHistoryData();
  },
  methods: {
    handleScroll(e: Event) {
      const listElement = e.target as HTMLElement;
@@ -178,29 +193,35 @@ export default defineComponent({
      if ('timetableId' in query) this.searchersValues['search-train'] = `#${query.timetableId}`;
    },
-    setSearchers(date: string, driver: string, train: string, dispatcher: string) {
+    setSearchers(date: string, driver: string, train: string, dispatcher: string, issuedFrom: string) {
      this.searchersValues['search-date'] = date;
      this.searchersValues['search-driver'] = driver;
      this.searchersValues['search-train'] = train;
      this.searchersValues['search-dispatcher'] = dispatcher;
      this.searchersValues['search-issuedFrom'] = issuedFrom;
    },
    resetOptions() {
-      this.setSearchers('', '', '', '');
+      this.setSearchers('', '', '', '', '');
      this.journalFilterActive = this.journalTimetableFilters[0];
      this.sorterActive.id = 'timetableId';
      this.filterList.forEach(
        (f) => (f.isActive = this.initFilters.find((initFilter) => initFilter.id == f.id)?.isActive || false)
      );
      this.fetchHistoryData();
    },
    async addHistoryData() {
      this.scrollDataLoaded = false;
-      const countFrom = this.timetableHistory.length;
+      this.currentQueryParams['countFrom'] = this.timetableHistory.length;
      const responseData: TimetableHistory[] = await (
-        await axios.get(`${TIMETABLES_API_URL}?${this.currentQuery}&countFrom=${countFrom}`)
+        await axios.get(`${TIMETABLES_API_URL}`, {
          params: { ...this.currentQueryParams },
        })
      ).data;
      if (!responseData) return;
@@ -215,57 +236,81 @@ export default defineComponent({
    },
    async fetchHistoryData() {
-      if(this.dataStatus == DataStatus.Loading) return;
+      const driverName = this.searchersValues['search-driver'].trim() || undefined;
-
+      const trainNo = this.searchersValues['search-train'].trim() || undefined;
-      const queries: string[] = [];
+      const authorName = this.searchersValues['search-dispatcher'].trim() || undefined;
-
+      const dateString = this.searchersValues['search-date'].trim() || undefined;
-      const driverName = this.searchersValues['search-driver'].trim();
+      const issuedFrom = this.searchersValues['search-issuedFrom'].trim() || undefined;
      const trainNo = this.searchersValues['search-train'].trim();
      const authorName = this.searchersValues['search-dispatcher'].trim();
      const dateString = this.searchersValues['search-date'].trim();
      const timestampFrom = dateString ? Date.parse(new Date(dateString).toISOString()) - 120 * 60 * 1000 : undefined;
      const timestampTo = timestampFrom ? timestampFrom + 86400000 : undefined;
-      if (driverName) queries.push(`driverName=${driverName}`);
+      const queryParams: TimetablesQueryParams = {};
      if (trainNo)
        queries.push(trainNo.startsWith('#') ? `timetableId=${trainNo.replace('#', '')}` : `trainNo=${trainNo}`);
      if (authorName) queries.push(`authorName=${authorName}`);
      if (timestampFrom && timestampTo) queries.push(`timestampFrom=${timestampFrom}`, `timestampTo=${timestampTo}`);
-      // Z API: const SORT_TYPES = ['allStopsCount', 'endDate', 'beginDate', 'routeDistance'];
+      this.filterList
-      if (this.sorterActive.id == 'distance') queries.push('sortBy=routeDistance');
+        .filter((f) => f.isActive)
-      else if (this.sorterActive.id == 'total-stops') queries.push('sortBy=allStopsCount');
+        .forEach((f) => {
-      else if (this.sorterActive.id == 'beginDate') queries.push('sortBy=beginDate');
+          switch (f.id) {
-      // else queries.push('sortBy=timetableId');
+            case JournalFilterType.ABANDONED:
-
+              queryParams['fulfilled'] = 0;
-      queries.push('countLimit=15');
+              queryParams['terminated'] = 1;
      switch (this.journalFilterActive.id) {
        case JournalFilterType.abandoned:
          queries.push('fulfilled=0', 'terminated=1');
              break;
-        case JournalFilterType.active:
+            case JournalFilterType.ACTIVE:
-          queries.push('terminated=0');
+              queryParams['fulfilled'] = undefined;
              queryParams['terminated'] = 0;
              break;
-        case JournalFilterType.fulfilled:
+            case JournalFilterType.FULFILLED:
-          queries.push('fulfilled=1');
+              queryParams['terminated'] = undefined;
              queryParams['fulfilled'] = 1;
              break;
            case JournalFilterType.ALL:
              queryParams['terminated'] = undefined;
              queryParams['fulfilled'] = undefined;
              break;
            case JournalFilterType.TWR_SKR:
              queryParams['twr'] = undefined;
              queryParams['skr'] = undefined;
              break;
            case JournalFilterType.TWR:
              queryParams['twr'] = 1;
              queryParams['skr'] = undefined;
              break;
            case JournalFilterType.SKR:
              queryParams['twr'] = undefined;
              queryParams['skr'] = 1;
              break;
            default:
              break;
          }
        });
-      if (this.currentQuery != queries.join('&')) this.dataStatus = DataStatus.Loading;
+      queryParams['driverName'] = driverName;
      queryParams[trainNo?.startsWith('#') ? 'timetableId' : 'trainNo'] = trainNo?.replace('#', '');
      queryParams['countFrom'] = undefined;
      queryParams['countLimit'] = undefined;
-      this.currentQuery = queries.join('&');
+      queryParams['authorName'] = authorName;
-      this.currentQueryArray = queries;
+      queryParams['timestampFrom'] = timestampFrom;
      queryParams['timestampTo'] = timestampTo;
      queryParams['issuedFrom'] = issuedFrom;
      queryParams['sortBy'] = this.sorterActive.id != 'timetableId' ? this.sorterActive.id : undefined;
      if (JSON.stringify(this.currentQueryParams) != JSON.stringify(queryParams)) this.dataStatus = DataStatus.Loading;
      this.currentQueryParams = queryParams;
      try {
        const responseData: TimetableHistory[] = await (
-          await axios.get(`${TIMETABLES_API_URL}?${this.currentQuery}`)
+          await axios.get(`${TIMETABLES_API_URL}`, {
            params: this.currentQueryParams,
          })
        ).data;
        if (!responseData) {
@@ -286,6 +331,7 @@ export default defineComponent({
            : '';
        this.dataStatus = DataStatus.Loaded;
        this.dataRefreshedAt = new Date();
      } catch (error) {
        this.dataStatus = DataStatus.Error;
        this.dataErrorMessage = 'Ups! Coś poszło nie tak!';
@@ -301,4 +347,3 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../styles/JournalSection.scss';
 </style>
@@ -172,6 +172,12 @@ button.back-btn {
  }
 }
 .scenery-section {
  position: relative;
  height: 100%;
  overflow-y: scroll;
 }
 .scenery-wrapper {
  display: grid;
  grid-template-columns: 4fr 5fr;
@@ -52,17 +52,6 @@ export default defineComponent({
  mounted() {
    this.filterStore.setupFilters();
    // this.filterStore.inputs.options.forEach((option) => {
    //   const value = StorageManager.getBooleanValue(option.name);
    //   option.value = value;
    //   this.filterStore.changeFilterValue({ name: option.name, value: value });
    // });
    // this.filterStore.inputs.sliders.forEach((slider) => {
    //   const value = StorageManager.getNumericValue(slider.name);
    //   slider.value = value;
    //   this.filterStore.changeFilterValue({ name: slider.name, value: value });
    // });
  },
 });
 </script>
@@ -2,7 +2,7 @@
  <section class="trains-view">
    <div class="trains_wrapper">
      <TrainOptions
-        :sorter-option-ids="['distance', 'id', 'progress', 'delay', 'mass', 'speed', 'length']"
+        :sorter-option-ids="['routeDistance', 'id', 'progress', 'delay', 'mass', 'speed', 'length']"
        :current-options-active="currentOptionsActive"
      />
@@ -21,7 +21,7 @@ import modalTrainMixin from '../mixins/modalTrainMixin';
 import Train from '../scripts/interfaces/Train';
 import { filteredTrainList } from '../scripts/managers/trainFilterManager';
 import { useStore } from '../store/store';
-import { TrainFilter } from '../types/Trains/TrainOptionsTypes';
+import { TrainFilter } from '../scripts/interfaces/Trains/TrainFilter';
 export default defineComponent({
  components: {
@@ -57,7 +57,7 @@ export default defineComponent({
    const store = useStore();
    const initTrainFilters = [...trainFilters.map((f) => ({ ...f }))];
-    const sorterActive = reactive({ id: 'distance', dir: -1 });
+    const sorterActive = reactive({ id: 'routeDistance', dir: -1 });
    const filterList = reactive([...trainFilters]) as TrainFilter[];
    const currentOptionsActive = ref(false);
@@ -9,7 +9,7 @@ export default defineConfig({
  plugins: [
    vue(),
    VitePWA({
-      registerType: 'prompt',
+      registerType: 'autoUpdate',
      workbox: {
        globPatterns: ['**/*.{js,css,html,png,svg,jpg}'],
@@ -52,3 +52,4 @@ export default defineConfig({
 });
@@ -31,7 +31,7 @@
  resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.20.10.tgz"
  integrity sha512-sEnuDPpOJR/fcafHMjpcpGN5M2jbUGUHwmuWKM/YdPzeEDJg8bgmbcWQFUfE32MQjti1koACvoPVsDe8Uq+idg==
-"@babel/core@^7.11.1":
+"@babel/core@^7.0.0", "@babel/core@^7.0.0-0", "@babel/core@^7.11.1", "@babel/core@^7.12.0", "@babel/core@^7.13.0", "@babel/core@^7.4.0-0":
  version "7.20.7"
  resolved "https://registry.npmjs.org/@babel/core/-/core-7.20.7.tgz"
  integrity sha512-t1ZjCluspe5DW24bn2Rr1CDb2v9rn/hROtg9a2tmd0+QYf4bsloYfLQzjG4qHPNMhWtKdGC33R5AxGR2Af2cBw==
@@ -912,114 +912,9 @@
    "@babel/helper-validator-identifier" "^7.19.1"
    to-fast-properties "^2.0.0"
 "@esbuild/android-arm64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.16.10.tgz#d784d8f13dbef50492ea55456fb50651e4036fbf"
  integrity sha512-47Y+NwVKTldTlDhSgJHZ/RpvBQMUDG7eKihqaF/u6g7s0ZPz4J1vy8A3rwnnUOF2CuDn7w7Gj/QcMoWz3U3SJw==
 "@esbuild/android-arm@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.16.10.tgz#becf6b5647c091b039121db8c17300a7dfd1ab4a"
  integrity sha512-RmJjQTRrO6VwUWDrzTBLmV4OJZTarYsiepLGlF2rYTVB701hSorPywPGvP6d8HCuuRibyXa5JX4s3jN2kHEtjQ==
 "@esbuild/android-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.16.10.tgz#648cacbb13a5047380a038e5d6d895015e31b525"
  integrity sha512-C4PfnrBMcuAcOurQzpF1tTtZz94IXO5JmICJJ3NFJRHbXXsQUg9RFG45KvydKqtFfBaFLCHpduUkUfXwIvGnRg==
 "@esbuild/darwin-arm64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.16.10.tgz#3ca7fd9a456d11752df77df6c030f2d08f27bda9"
  integrity sha512-bH/bpFwldyOKdi9HSLCLhhKeVgRYr9KblchwXgY2NeUHBB/BzTUHtUSBgGBmpydB1/4E37m+ggXXfSrnD7/E7g==
 "@esbuild/darwin-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.16.10.tgz#7eb71b8da4106627f01553def517d3c5e5942592"
  integrity sha512-OXt7ijoLuy+AjDSKQWu+KdDFMBbdeaL6wtgMKtDUXKWHiAMKHan5+R1QAG6HD4+K0nnOvEJXKHeA9QhXNAjOTQ==
 "@esbuild/freebsd-arm64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.16.10.tgz#c69c78ee1d17d35ad2cf76a1bb67788000a84b43"
  integrity sha512-shSQX/3GHuspE3Uxtq5kcFG/zqC+VuMnJkqV7LczO41cIe6CQaXHD3QdMLA4ziRq/m0vZo7JdterlgbmgNIAlQ==
 "@esbuild/freebsd-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.16.10.tgz#a9804ab1b9366f915812af24ad5cfc1c0db01441"
  integrity sha512-5YVc1zdeaJGASijZmTzSO4h6uKzsQGG3pkjI6fuXvolhm3hVRhZwnHJkforaZLmzvNv5Tb7a3QL2FAVmrgySIA==
 "@esbuild/linux-arm64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.16.10.tgz#d9a9ddfcb28ed8cced688bc112ef66283d6fa77f"
  integrity sha512-2aqeNVxIaRfPcIaMZIFoblLh588sWyCbmj1HHCCs9WmeNWm+EIN0SmvsmPvTa/TsNZFKnxTcvkX2eszTcCqIrA==
 "@esbuild/linux-arm@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.16.10.tgz#f32cdac1d3319c83ae7f9f31238dd1284ee6bba2"
  integrity sha512-c360287ZWI2miBnvIj23bPyVctgzeMT2kQKR+x94pVqIN44h3GF8VMEs1SFPH1UgyDr3yBbx3vowDS1SVhyVhA==
 "@esbuild/linux-ia32@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.16.10.tgz#1e023478e42f3a01cad48f4af50120d4b639af03"
  integrity sha512-sqMIEWeyrLGU7J5RB5fTkLRIFwsgsQ7ieWXlDLEmC2HblPYGb3AucD7inw2OrKFpRPKsec1l+lssiM3+NV5aOw==
 "@esbuild/linux-loong64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.16.10.tgz#f9098865a69d1d6e2f8bda51c7f9d4240f20b771"
  integrity sha512-O7Pd5hLEtTg37NC73pfhUOGTjx/+aXu5YoSq3ahCxcN7Bcr2F47mv+kG5t840thnsEzrv0oB70+LJu3gUgchvg==
 "@esbuild/linux-mips64el@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.16.10.tgz#574725ad2ea81b7783b7ba7d1ab3475f8fdd8d32"
  integrity sha512-FN8mZOH7531iPHM0kaFhAOqqNHoAb6r/YHW2ZIxNi0a85UBi2DO4Vuyn7t1p4UN8a4LoAnLOT1PqNgHkgBJgbA==
 "@esbuild/linux-ppc64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.16.10.tgz#11da658c54514a693813af56bb28951d563a90c3"
  integrity sha512-Dg9RiqdvHOAWnOKIOTsIx8dFX9EDlY2IbPEY7YFzchrCiTZmMkD7jWA9UdZbNUygPjdmQBVPRCrLydReFlX9yg==
 "@esbuild/linux-riscv64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.16.10.tgz#3af4600adbd6c5a4a6f1da05771f4aa6774baab2"
  integrity sha512-XMqtpjwzbmlar0BJIxmzu/RZ7EWlfVfH68Vadrva0Wj5UKOdKvqskuev2jY2oPV3aoQUyXwnMbMrFmloO2GfAw==
 "@esbuild/linux-s390x@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.16.10.tgz#9e3377aaf0191a9d6628e806a279085ec4391f3e"
  integrity sha512-fu7XtnoeRNFMx8DjK3gPWpFBDM2u5ba+FYwg27SjMJwKvJr4bDyKz5c+FLXLUSSAkMAt/UL+cUbEbra+rYtUgw==
 "@esbuild/linux-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.16.10.tgz"
  integrity sha512-61lcjVC/RldNNMUzQQdyCWjCxp9YLEQgIxErxU9XluX7juBdGKb0pvddS0vPNuCvotRbzijZ1pzII+26haWzbA==
 "@esbuild/netbsd-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.16.10.tgz#ebac59e3986834af04bbafcee7b0c1f31cd477c6"
  integrity sha512-JeZXCX3viSA9j4HqSoygjssdqYdfHd6yCFWyfSekLbz4Ef+D2EjvsN02ZQPwYl5a5gg/ehdHgegHhlfOFP0HCA==
 "@esbuild/openbsd-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.16.10.tgz#9eaa6cac3b80db45090c0946e62de5b5689c61d1"
  integrity sha512-3qpxQKuEVIIg8SebpXsp82OBrqjPV/OwNWmG+TnZDr3VGyChNnGMHccC1xkbxCHDQNnnXjxhMQNyHmdFJbmbRA==
 "@esbuild/sunos-x64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.16.10.tgz#31e5e4b814ef43d300e26511e486a4716a390d5f"
  integrity sha512-z+q0xZ+et/7etz7WoMyXTHZ1rB8PMSNp/FOqURLJLOPb3GWJ2aj4oCqFCjPwEbW1rsT7JPpxeH/DwGAWk/I1Bg==
 "@esbuild/win32-arm64@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.16.10.tgz#ca58472dc03ca79e6d03f8a31113979ff253d94f"
  integrity sha512-+YYu5sbQ9npkNT9Dec+tn1F/kjg6SMgr6bfi/6FpXYZvCRfu2YFPZGb+3x8K30s8eRxFpoG4sGhiSUkr1xbHEw==
 "@esbuild/win32-ia32@0.16.10":
  version "0.16.10"
  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.16.10.tgz#c572df2c65ab118feed0a5da5a4a193846d74e43"
  integrity sha512-Aw7Fupk7XNehR1ftHGYwUteyJ2q+em/aE+fVU3YMTBN2V5A7Z4aVCSV+SvCp9HIIHZavPFBpbdP3VfjQpdf6Xg==
 "@esbuild/win32-x64@0.16.10":
  version "0.16.10"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.16.10.tgz#0e9c6a5e69c10d96aff2386b7ee9646138c2a831"
+  resolved "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.16.10.tgz"
  integrity sha512-qddWullt3sC1EIpfHvCRBq3H4g3L86DZpD6n8k2XFjFVyp01D++uNbN1hT/JRsHxTbyyemZcpwL5aRlJwc/zFw==
 "@firebase/analytics-compat@0.1.14":
@@ -1081,7 +976,7 @@
    "@firebase/util" "1.7.0"
    tslib "^2.1.0"
-"@firebase/app-compat@0.1.35":
+"@firebase/app-compat@0.1.35", "@firebase/app-compat@0.x":
  version "0.1.35"
  resolved "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.1.35.tgz"
  integrity sha512-6ax9yXCPEBSREHxo+nCpSgSg01mGTvR4I7u/EHqVNNqG8uEWog7sUan3Y3vr3q3zH8t5BkXDGejOH9atF+XnAQ==
@@ -1092,12 +987,12 @@
    "@firebase/util" "1.7.0"
    tslib "^2.1.0"
-"@firebase/app-types@0.8.0":
+"@firebase/app-types@0.8.0", "@firebase/app-types@0.x":
  version "0.8.0"
  resolved "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.8.0.tgz"
  integrity sha512-Lec3VVquUwXPn2UReGSsfTxuMBVRmzGIwA/CJnF0LQuPgv9kOmXk9mVqsDMfHxHtqjai0n6wWHR2TqjdVV/bYA==
-"@firebase/app@0.8.0":
+"@firebase/app@0.8.0", "@firebase/app@0.x":
  version "0.8.0"
  resolved "https://registry.npmjs.org/@firebase/app/-/app-0.8.0.tgz"
  integrity sha512-9kZjhIDv4u4PlrCgcQVBA2u8BZHrP8rUWDltmCUi9BLHv0tltfxLMZODV5LeuAfCJKVp2dbIrpGHPxAaLLl/ww==
@@ -1384,7 +1279,7 @@
    node-fetch "2.6.7"
    tslib "^2.1.0"
-"@firebase/util@1.7.0":
+"@firebase/util@1.7.0", "@firebase/util@1.x":
  version "1.7.0"
  resolved "https://registry.npmjs.org/@firebase/util/-/util-1.7.0.tgz"
  integrity sha512-n5g1WWd+E5IYQwtKxmTJDlhfT762mk/d7yigeh8QaS46cnvngwguOhNwlS8fniEJ7pAgyZ9v05OQMKdfMnws6g==
@@ -1472,7 +1367,16 @@
    "@jridgewell/set-array" "^1.0.0"
    "@jridgewell/sourcemap-codec" "^1.4.10"
-"@jridgewell/gen-mapping@^0.3.0", "@jridgewell/gen-mapping@^0.3.2":
+"@jridgewell/gen-mapping@^0.3.0":
  version "0.3.2"
  resolved "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz"
  integrity sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==
  dependencies:
    "@jridgewell/set-array" "^1.0.1"
    "@jridgewell/sourcemap-codec" "^1.4.10"
    "@jridgewell/trace-mapping" "^0.3.9"
 "@jridgewell/gen-mapping@^0.3.2":
  version "0.3.2"
  resolved "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz"
  integrity sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==
@@ -1499,7 +1403,7 @@
    "@jridgewell/gen-mapping" "^0.3.0"
    "@jridgewell/trace-mapping" "^0.3.9"
-"@jridgewell/sourcemap-codec@1.4.14", "@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@^1.4.13":
+"@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@^1.4.13", "@jridgewell/sourcemap-codec@1.4.14":
  version "1.4.14"
  resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz"
  integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
@@ -1520,7 +1424,7 @@
    "@nodelib/fs.stat" "2.0.5"
    run-parallel "^1.1.9"
-"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
+"@nodelib/fs.stat@^2.0.2", "@nodelib/fs.stat@2.0.5":
  version "2.0.5"
  resolved "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz"
  integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
@@ -1655,22 +1559,22 @@
    magic-string "^0.25.0"
    string.prototype.matchall "^4.0.6"
 "@types/estree@0.0.39":
  version "0.0.39"
  resolved "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz"
  integrity sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==
 "@types/estree@^1.0.0":
  version "1.0.0"
  resolved "https://registry.npmjs.org/@types/estree/-/estree-1.0.0.tgz"
  integrity sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==
 "@types/estree@0.0.39":
  version "0.0.39"
  resolved "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz"
  integrity sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==
 "@types/long@^4.0.1":
  version "4.0.2"
  resolved "https://registry.npmjs.org/@types/long/-/long-4.0.2.tgz"
  integrity sha512-MqTGEo5bj5t157U6fA/BiDynNkn0YknVdh48CMPkTSpFTVmvao5UQmm7uEF6xBEo7qIMAlY/JSleYaE6VOdpaA==
-"@types/node@*", "@types/node@>=12.12.47", "@types/node@>=13.7.0", "@types/node@^18.11.17":
+"@types/node@*", "@types/node@^18.11.17", "@types/node@>= 14", "@types/node@>=12.12.47", "@types/node@>=13.7.0":
  version "18.11.18"
  resolved "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz"
  integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
@@ -1757,15 +1661,7 @@
    estree-walker "^2.0.2"
    source-map "^0.6.1"
-"@vue/compiler-dom@3.2.40":
+"@vue/compiler-dom@^3.2.45", "@vue/compiler-dom@3.2.45":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.40.tgz"
  integrity sha512-OZCNyYVC2LQJy4H7h0o28rtk+4v+HMQygRTpmibGoG9wZyomQiS5otU7qo3Wlq5UfHDw2RFwxb9BJgKjVpjrQw==
  dependencies:
    "@vue/compiler-core" "3.2.40"
    "@vue/shared" "3.2.40"
 "@vue/compiler-dom@3.2.45", "@vue/compiler-dom@^3.2.45":
  version "3.2.45"
  resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.45.tgz"
  integrity sha512-tyYeUEuKqqZO137WrZkpwfPCdiiIeXYCcJ8L4gWz9vqaxzIQRccTSwSWZ/Axx5YR2z+LvpUbmPNXxuBU45lyRw==
@@ -1773,21 +1669,13 @@
    "@vue/compiler-core" "3.2.45"
    "@vue/shared" "3.2.45"
-"@vue/compiler-sfc@3.2.40":
+"@vue/compiler-dom@3.2.40":
  version "3.2.40"
-  resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.40.tgz"
+  resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.40.tgz"
-  integrity sha512-tzqwniIN1fu1PDHC3CpqY/dPCfN/RN1thpBC+g69kJcrl7mbGiHKNwbA6kJ3XKKy8R6JLKqcpVugqN4HkeBFFg==
+  integrity sha512-OZCNyYVC2LQJy4H7h0o28rtk+4v+HMQygRTpmibGoG9wZyomQiS5otU7qo3Wlq5UfHDw2RFwxb9BJgKjVpjrQw==
  dependencies:
    "@babel/parser" "^7.16.4"
    "@vue/compiler-core" "3.2.40"
    "@vue/compiler-dom" "3.2.40"
    "@vue/compiler-ssr" "3.2.40"
    "@vue/reactivity-transform" "3.2.40"
    "@vue/shared" "3.2.40"
    estree-walker "^2.0.2"
    magic-string "^0.25.7"
    postcss "^8.1.10"
    source-map "^0.6.1"
 "@vue/compiler-sfc@^3.2.45":
  version "3.2.45"
@@ -1805,6 +1693,22 @@
    postcss "^8.1.10"
    source-map "^0.6.1"
 "@vue/compiler-sfc@3.2.40":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.40.tgz"
  integrity sha512-tzqwniIN1fu1PDHC3CpqY/dPCfN/RN1thpBC+g69kJcrl7mbGiHKNwbA6kJ3XKKy8R6JLKqcpVugqN4HkeBFFg==
  dependencies:
    "@babel/parser" "^7.16.4"
    "@vue/compiler-core" "3.2.40"
    "@vue/compiler-dom" "3.2.40"
    "@vue/compiler-ssr" "3.2.40"
    "@vue/reactivity-transform" "3.2.40"
    "@vue/shared" "3.2.40"
    estree-walker "^2.0.2"
    magic-string "^0.25.7"
    postcss "^8.1.10"
    source-map "^0.6.1"
 "@vue/compiler-ssr@3.2.40":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.40.tgz"
@@ -1848,13 +1752,6 @@
    estree-walker "^2.0.2"
    magic-string "^0.25.7"
 "@vue/reactivity@3.2.40":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.40.tgz"
  integrity sha512-N9qgGLlZmtUBMHF9xDT4EkD9RdXde1Xbveb+niWMXuHVWQP5BzgRmE3SFyUBBcyayG4y1lhoz+lphGRRxxK4RA==
  dependencies:
    "@vue/shared" "3.2.40"
 "@vue/reactivity@^3.2.45":
  version "3.2.45"
  resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.45.tgz"
@@ -1862,6 +1759,13 @@
  dependencies:
    "@vue/shared" "3.2.45"
 "@vue/reactivity@3.2.40":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.40.tgz"
  integrity sha512-N9qgGLlZmtUBMHF9xDT4EkD9RdXde1Xbveb+niWMXuHVWQP5BzgRmE3SFyUBBcyayG4y1lhoz+lphGRRxxK4RA==
  dependencies:
    "@vue/shared" "3.2.40"
 "@vue/runtime-core@3.2.40":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.40.tgz"
@@ -1887,22 +1791,22 @@
    "@vue/compiler-ssr" "3.2.40"
    "@vue/shared" "3.2.40"
 "@vue/shared@^3.2.45", "@vue/shared@3.2.45":
  version "3.2.45"
  resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.2.45.tgz"
  integrity sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==
 "@vue/shared@3.2.40":
  version "3.2.40"
  resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.2.40.tgz"
  integrity sha512-0PLQ6RUtZM0vO3teRfzGi4ltLUO5aO+kLgwh4Um3THSR03rpQWLTuRCkuO5A41ITzwdWeKdPHtSARuPkoo5pCQ==
 "@vue/shared@3.2.45", "@vue/shared@^3.2.45":
  version "3.2.45"
  resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.2.45.tgz"
  integrity sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==
 acorn@^8.5.0:
  version "8.8.1"
  resolved "https://registry.npmjs.org/acorn/-/acorn-8.8.1.tgz"
  integrity sha512-7zFpHzhnqYKrkYdUjF1HI1bzd0VygEGX8lFk4k5zVMqHEoES+P+7TKI+EvLO9WVMJ8eekdO0aDEK044xTXwPPA==
-ajv@^8.6.0:
+ajv@^8.6.0, ajv@>=8:
  version "8.11.2"
  resolved "https://registry.npmjs.org/ajv/-/ajv-8.11.2.tgz"
  integrity sha512-E4bfmKAhGiSTvMfL1Myyycaub+cUEU2/IvpylXkUu7CHBkBj1f/ikdzbD7YQ6FKUbixDxeYvB/xY4fvyroDlQg==
@@ -2019,7 +1923,7 @@ braces@^3.0.2, braces@~3.0.2:
  dependencies:
    fill-range "^7.0.1"
-browserslist@^4.21.3, browserslist@^4.21.4:
+browserslist@^4.21.3, browserslist@^4.21.4, "browserslist@>= 4.21.0":
  version "4.21.4"
  resolved "https://registry.npmjs.org/browserslist/-/browserslist-4.21.4.tgz"
  integrity sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==
@@ -2048,9 +1952,9 @@ call-bind@^1.0.0, call-bind@^1.0.2:
    get-intrinsic "^1.0.2"
 caniuse-lite@^1.0.30001400:
-  version "1.0.30001441"
+  version "1.0.30001503"
-  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001441.tgz"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001503.tgz"
-  integrity sha512-OyxRR4Vof59I3yGWXws6i908EtGbMzVUi3ganaZQHmydk1iwDhRnvaPG2WaR0KcqrDFKrxVZHULT396LEPhXfg==
+  integrity sha512-Sf9NiF+wZxPfzv8Z3iS0rXM1Do+iOy2Lxvib38glFX+08TCYYYGR5fRJXk4d77C4AYwhUjgYgMsMudbh2TqCKw==
 chalk@^2.0.0:
  version "2.4.2"
@@ -2107,16 +2011,16 @@ color-convert@^2.0.1:
  dependencies:
    color-name "~1.1.4"
 color-name@1.1.3:
  version "1.1.3"
  resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz"
  integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==
 color-name@~1.1.4:
  version "1.1.4"
  resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz"
  integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
 color-name@1.1.3:
  version "1.1.3"
  resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz"
  integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==
 combined-stream@^1.0.8:
  version "1.0.8"
  resolved "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz"
@@ -2442,11 +2346,6 @@ fs.realpath@^1.0.0:
  resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
  integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 fsevents@~2.3.2:
  version "2.3.2"
  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
  integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
 function-bind@^1.1.1:
  version "1.1.1"
  resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz"
@@ -2591,7 +2490,7 @@ http-parser-js@>=0.5.1:
  resolved "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.8.tgz"
  integrity sha512-SGeBX54F94Wgu5RH3X5jsDtf4eHyRogWX1XGT3b4HuW3tQPM4AaBzoUji/4AAJNXCEOWZ5O0DgZmJw1947gD5Q==
-idb@7.0.1, idb@^7.0.1:
+idb@^7.0.1, idb@7.0.1:
  version "7.0.1"
  resolved "https://registry.npmjs.org/idb/-/idb-7.0.1.tgz"
  integrity sha512-UUxlE7vGWK5RfB/fDwEGgRf84DY/ieqNha6msMV99UsEMQhJ1RwbCd8AYBj3QMgnE3VZnfQvm4oKVCJTYlqIgg==
@@ -2614,7 +2513,7 @@ inflight@^1.0.4:
    once "^1.3.0"
    wrappy "1"
-inherits@2, inherits@~2.0.3:
+inherits@~2.0.3, inherits@2:
  version "2.0.4"
  resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz"
  integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
@@ -2937,7 +2836,14 @@ minimatch@^3.0.4, minimatch@^3.1.1:
  dependencies:
    brace-expansion "^1.1.7"
-minimatch@^5.0.1, minimatch@^5.1.1:
+minimatch@^5.0.1:
  version "5.1.2"
  resolved "https://registry.npmjs.org/minimatch/-/minimatch-5.1.2.tgz"
  integrity sha512-bNH9mmM9qsJ2X4r2Nat1B//1dJVcn3+iBLa3IgqJ7EbGaDNepL9QSHOxN4ng33s52VMMhhIfgCYDk3C4ZmlDAg==
  dependencies:
    brace-expansion "^2.0.1"
 minimatch@^5.1.1:
  version "5.1.2"
  resolved "https://registry.npmjs.org/minimatch/-/minimatch-5.1.2.tgz"
  integrity sha512-bNH9mmM9qsJ2X4r2Nat1B//1dJVcn3+iBLa3IgqJ7EbGaDNepL9QSHOxN4ng33s52VMMhhIfgCYDk3C4ZmlDAg==
@@ -3237,14 +3143,14 @@ rollup-plugin-terser@^7.0.0:
    serialize-javascript "^4.0.0"
    terser "^5.0.0"
-rollup@^2.43.1:
+"rollup@^1.20.0 || ^2.0.0", rollup@^1.20.0||^2.0.0, rollup@^2.0.0, rollup@^2.43.1:
  version "2.79.1"
  resolved "https://registry.npmjs.org/rollup/-/rollup-2.79.1.tgz"
  integrity sha512-uKxbd0IhMZOhjAiD5oAFp7BqvkA4Dv47qpOCtaNvng4HBwdbWtdOh8f5nZNuk2rp51PMGk3bzfWu5oayNEuYnw==
  optionalDependencies:
    fsevents "~2.3.2"
-rollup@^3.7.0, rollup@^3.7.2:
+rollup@^1.20.0||^2.0.0||^3.0.0, rollup@^3.7.0, rollup@^3.7.2:
  version "3.7.5"
  resolved "https://registry.npmjs.org/rollup/-/rollup-3.7.5.tgz"
  integrity sha512-z0ZbqHBtS/et2EEUKMrAl2CoSdwN7ZPzL17UMiKN9RjjqHShTlv7F9J6ZJZJNREYjBh3TvBrdfjkFDIXFNeuiQ==
@@ -3258,16 +3164,16 @@ run-parallel@^1.1.9:
  dependencies:
    queue-microtask "^1.2.2"
 safe-buffer@>=5.1.0:
  version "5.2.1"
  resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz"
  integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
 safe-buffer@^5.1.0, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
  version "5.1.2"
  resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz"
  integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==
 safe-buffer@>=5.1.0:
  version "5.2.1"
  resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz"
  integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
 safe-regex-test@^1.0.0:
  version "1.0.0"
  resolved "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz"
@@ -3277,7 +3183,7 @@ safe-regex-test@^1.0.0:
    get-intrinsic "^1.1.3"
    is-regex "^1.1.4"
-sass@^1.53.0:
+sass@*, sass@^1.53.0:
  version "1.55.0"
  resolved "https://registry.npmjs.org/sass/-/sass-1.55.0.tgz"
  integrity sha512-Pk+PMy7OGLs9WaxZGJMn7S96dvlyVBwwtToX895WmCpAOr5YiJYEUJfiJidMuKb613z2xNWcXCHEuOvjZbqC6A==
@@ -3339,7 +3245,7 @@ socket.io-parser@~4.2.0:
    "@socket.io/component-emitter" "~3.1.0"
    debug "~4.3.1"
-"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.2:
+source-map-js@^1.0.2, "source-map-js@>=0.6.2 <2.0.0":
  version "1.0.2"
  resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz"
  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
@@ -3352,7 +3258,7 @@ source-map-support@~0.5.20:
    buffer-from "^1.0.0"
    source-map "^0.6.0"
-source-map@0.6.1, source-map@^0.6.0, source-map@^0.6.1:
+source-map@^0.6.0, source-map@^0.6.1, source-map@0.6.1:
  version "0.6.1"
  resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz"
  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
@@ -3369,6 +3275,13 @@ sourcemap-codec@^1.4.8:
  resolved "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz"
  integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
 string_decoder@~1.1.1:
  version "1.1.1"
  resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz"
  integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==
  dependencies:
    safe-buffer "~5.1.0"
 string-width@^4.1.0, string-width@^4.2.0:
  version "4.2.3"
  resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
@@ -3410,13 +3323,6 @@ string.prototype.trimstart@^1.0.6:
    define-properties "^1.1.4"
    es-abstract "^1.20.4"
 string_decoder@~1.1.1:
  version "1.1.1"
  resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz"
  integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==
  dependencies:
    safe-buffer "~5.1.0"
 stringify-object@^3.3.0:
  version "3.3.0"
  resolved "https://registry.npmjs.org/stringify-object/-/stringify-object-3.3.0.tgz"
@@ -3445,7 +3351,14 @@ supports-color@^5.3.0:
  dependencies:
    has-flag "^3.0.0"
-supports-color@^7.0.0, supports-color@^7.1.0:
+supports-color@^7.0.0:
  version "7.2.0"
  resolved "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz"
  integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==
  dependencies:
    has-flag "^4.0.0"
 supports-color@^7.1.0:
  version "7.2.0"
  resolved "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz"
  integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==
@@ -3472,7 +3385,7 @@ tempy@^0.6.0:
    type-fest "^0.16.0"
    unique-string "^2.0.0"
-terser@^5.0.0:
+terser@^5.0.0, terser@^5.4.0:
  version "5.16.1"
  resolved "https://registry.npmjs.org/terser/-/terser-5.16.1.tgz"
  integrity sha512-xvQfyfA1ayT0qdK47zskQgRZeWLoOQ8JQ6mIgRGVNwZKdQMU+5FkCBjmv4QjcrTzyZquRw2FVtlJSRUmMKQslw==
@@ -3523,7 +3436,7 @@ type-fest@^0.16.0:
  resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.16.0.tgz"
  integrity sha512-eaBzG6MxNzEn9kiwvtre90cXaNLkmadMWa1zQMs3XORCXNbsH/OewwbxC5ia9dCxIxnTAsSxXJaa/p5y8DlvJg==
-typescript@^4.9.4:
+typescript@*, typescript@^4.9.4, typescript@>=4.4.4:
  version "4.9.4"
  resolved "https://registry.npmjs.org/typescript/-/typescript-4.9.4.tgz"
  integrity sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg==
@@ -3611,7 +3524,7 @@ vite-plugin-pwa@^0.14.0:
    workbox-build "^6.5.4"
    workbox-window "^6.5.4"
-vite@^4.0.3:
+"vite@^3.1.0 || ^4.0.0", vite@^4.0.0, vite@^4.0.3:
  version "4.0.3"
  resolved "https://registry.npmjs.org/vite/-/vite-4.0.3.tgz"
  integrity sha512-HvuNv1RdE7deIfQb8mPk51UKjqptO/4RXZ5yXSAvurd5xOckwS/gg8h9Tky3uSbnjYTgUm0hVCet1cyhKd73ZA==
@@ -3661,7 +3574,7 @@ vue-tsc@^1.0.18:
    "@volar/vue-language-core" "1.0.18"
    "@volar/vue-typescript" "1.0.18"
-vue@^3.2.37:
+"vue@^2.6.14 || ^3.2.0", vue@^3.0.0, "vue@^3.0.0-0 || ^2.6.0", vue@^3.2.0, vue@^3.2.25, vue@^3.2.37, vue@3.2.40:
  version "3.2.40"
  resolved "https://registry.npmjs.org/vue/-/vue-3.2.40.tgz"
  integrity sha512-1mGHulzUbl2Nk3pfvI5aXYYyJUs1nm4kyvuz38u4xlQkLUn1i2R7nDbI4TufECmY8v1qNBHYy62bCaM+3cHP2A==
@@ -3874,7 +3787,7 @@ workbox-sw@6.5.4:
  resolved "https://registry.npmjs.org/workbox-sw/-/workbox-sw-6.5.4.tgz"
  integrity sha512-vo2RQo7DILVRoH5LjGqw3nphavEjK4Qk+FenXeUsknKn14eCNedHOXWbmnvP4ipKhlE35pvJ4yl4YYf6YsJArA==
-workbox-window@6.5.4, workbox-window@^6.5.4:
+workbox-window@^6.5.4, workbox-window@6.5.4:
  version "6.5.4"
  resolved "https://registry.npmjs.org/workbox-window/-/workbox-window-6.5.4.tgz"
  integrity sha512-HnLZJDwYBE+hpG25AQBO8RUWBJRaCsI9ksQJEp3aCOFCaG5kqaToAYXFRAHxzRluM2cQbGzdQF5rjKPWPA1fug==
Author	SHA1	Message	Date
Spythere	91f4c6bc57	Merge do wersji 1.16.2	2023-07-01 01:25:10 +02:00
Spythere	c133eb060b	bump: 1.16.2	2023-07-01 01:20:04 +02:00
Spythere	7ffc169d8a	hotfix	2023-07-01 01:19:50 +02:00
Spythere	1b85cc5f58	poprawki dziennika rj / dr	2023-06-30 20:50:03 +02:00
Spythere	72ff857fff	dodatkowe info o postojach w dzienniku RJ	2023-06-27 02:52:41 +02:00
Spythere	96d64e77fc	feature: nieskończona lista historii dr/rj scenerii	2023-06-24 13:46:37 +02:00
Spythere	6ceae3f161	revamp tabeli historii dyżurów	2023-06-23 14:19:28 +02:00
Spythere	8e8e27658c	Merge do wersji 1.16.1 Wersja 1.16.1	2023-06-22 19:27:39 +02:00
Spythere	9b6ace394a	bump v.1.16.1	2023-06-21 18:36:21 +02:00
Spythere	6cfeaa91bf	responsywność dailyStats	2023-06-21 18:35:23 +02:00
Spythere	08b208aeaa	fix tłumaczeń	2023-06-21 18:31:16 +02:00
Spythere	a089b5275b	hotfix daily stats	2023-06-21 18:30:02 +02:00
Spythere	8425cd4371	przyjazdy/odjazdy stacji pośrednich RJ w dzienniku	2023-06-21 18:26:16 +02:00
Spythere	dbdc517b87	fix tłumaczeń	2023-06-21 17:32:36 +02:00
Spythere	e271358a27	fix timetable id	2023-06-21 17:19:31 +02:00
Spythere	66262e3fcd	dodatkowe statystyki dnia	2023-06-21 17:16:02 +02:00
Spythere	5b2b6bdea2	bump 1.16.0.1	2023-06-16 01:17:33 +02:00
Spythere	c8587de6d9	npm update	2023-06-15 15:28:32 +02:00
Spythere	1f376085f2	feature: info o elektryfikacji spawnu na scenerii	2023-06-15 15:28:12 +02:00
Spythere	f28600a7fa	Merge do wersji 1.16.0 Wersja 1.16.0	2023-06-12 01:33:45 +02:00
Spythere	d59ead87e6	bump v1.16.0	2023-06-12 01:21:49 +02:00
Spythere	34d91bc800	poprawki w pokazywaniu statystyk	2023-06-12 01:19:31 +02:00
Spythere	cf9991d8a0	layout filtrów dzienników	2023-06-12 00:51:17 +02:00
Spythere	4ffb79d62b	poprawki pobierania danych	2023-06-11 21:47:50 +02:00
Spythere	d9f5edb4fe	poprawki tłumaczeń	2023-06-11 21:47:22 +02:00
Spythere	1b2112430a	feature: długości szlaków po kliknięciu	2023-06-08 23:35:57 +02:00
Spythere	0a972a23ef	fix: asynchroniczność pobierania danych z API	2023-06-04 13:35:53 +02:00
Spythere	6d52724d06	zapamiętywanie stanu statystyk dnia	2023-06-04 12:19:46 +02:00
Spythere	99415c35d3	rozbudowane filtry dziennika RJ	2023-06-04 12:06:15 +02:00
Spythere	c3f687d439	hotfixy dzienników	2023-06-04 01:45:58 +02:00
Spythere	266edfd6e6	reorder typów danych	2023-06-04 00:33:43 +02:00
Spythere	d32d5ad91b	poprawki dzienników	2023-06-03 18:55:44 +02:00
Spythere	c3481470cb	optymalizacja zapytań; filtr scenerii pocz.	2023-06-03 15:49:15 +02:00
Spythere	57e88b9abc	Merge do wersji 1.15.1 Wersja 1.15.1	2023-06-02 20:09:43 +02:00
Spythere	44ebf53798	poprawki pwa	2023-06-02 20:06:25 +02:00
Spythere	145dc72b6b	pwa: zmiana na autoUpdate	2023-06-02 19:41:33 +02:00
Spythere	b7f3761940	Merge do wersji 1.15.0 Wersja 1.15.0	2023-06-02 01:16:37 +02:00
Spythere	ea7c49dfb3	bump: 1.15.0	2023-06-02 01:10:01 +02:00
Spythere	5d6785813a	fix: odznaki TWR/SKR; dodano do dziennika	2023-06-02 01:07:44 +02:00
Spythere	a0054aed14	fix: optymalizacja zapytań historii RJ scenerii	2023-06-02 00:51:03 +02:00
Spythere	471e6f5216	Wersja 1.14.3 Wersja 1.14.3	2023-05-18 02:42:27 +02:00
Spythere	a617eef00e	bump 1.14.3	2023-05-18 02:38:13 +02:00
Spythere	38e700ecd6	migracja z route na routeNames	2023-05-18 02:37:27 +02:00
Spythere	da1be0e10a	Wersja 1.14.2	2023-05-17 02:24:05 +02:00
Spythere	f49bb12948	bump 1.14.2	2023-05-17 02:21:13 +02:00
Spythere	02673a3d70	poprawki filtrów scenerii	2023-05-16 14:27:31 +02:00
Spythere	4ddc7345df	poprawki filtrów RJ	2023-05-16 02:40:08 +02:00
Spythere	5d822684c0	feature: rozszerzone filtry RJ	2023-05-14 15:05:51 +02:00
Spythere	69fa15c70a	v1.14.1 v1.14.1	2023-04-13 19:25:30 +02:00
Spythere	9192067388	1.14.1	2023-04-13 19:21:36 +02:00
Spythere	2b41e5b857	hotfix	2023-04-13 19:21:24 +02:00
Spythere	674680ff14	1.14: hotfixy 1.14 hotfixy	2023-04-13 19:15:38 +02:00
Spythere	475bd2ff10	przeniesienie skrótów do widoku scenerii	2023-04-13 19:11:44 +02:00
Spythere	074d1eb155	Hotfix tłumaczeń	2023-04-13 18:50:00 +02:00
Spythere	378393de89	Wersja 1.14.0 Wersja 1.14.0	2023-04-13 15:45:39 +02:00
Spythere	03e61083a7	tłumaczenie stopki	2023-04-13 15:37:34 +02:00
Spythere	0b746fce8c	hotfix headera	2023-04-13 15:32:41 +02:00
Spythere	5883e710be	bump wersji: 1.14	2023-04-13 15:26:22 +02:00
Spythere	3d0695a17b	Poprawki w headerze i stopce	2023-04-13 15:25:39 +02:00
Spythere	4adb76eeb0	feature: podpisy status indicatorów dla RJ	2023-04-11 00:33:14 +02:00
Spythere	4c41076519	feature: skrót posterunku w tabelce	2023-04-09 01:37:11 +02:00
Spythere	77f61d17fd	hotfix: wygląd badge'a	2023-04-09 00:19:53 +02:00
Spythere	032a84cbcf	feature: historia zmian w zestawieniu pociągów	2023-03-20 22:39:23 +01:00
Spythere	de9851ebcc	Wersja 1.13.0 Wersja 1.13.0	2023-03-16 01:31:18 +01:00
Spythere	ff78eba927	hotfixy filtrów	2023-03-15 18:15:01 +01:00
Spythere	e4c5f6a322	filtry pociągów	2023-03-15 17:56:27 +01:00
Spythere	0a78761928	hotfix tłumaczeń	2023-03-15 15:34:36 +01:00
Spythere	4843043c29	bump wersji: 1.13.0	2023-03-15 15:20:28 +01:00
Spythere	9e1df1fb61	filtry pociągów	2023-03-15 15:19:50 +01:00
Spythere	021474cfb0	fix: tłumaczenia; hotfixy	2023-03-14 23:13:37 +01:00
Spythere	7d0e68862c	filtry scenerii	2023-03-14 21:42:39 +01:00
Spythere	653d45dfc6	scenerie: remake filtrów	2023-03-13 22:26:00 +01:00
Spythere	4a4e1240a4	widok scenerii: odnośniki do tablic przy aktywnych RJ	2023-03-10 16:59:16 +01:00
Spythere	14ca48a90d	hotfix	2023-03-10 16:30:36 +01:00
Spythere	a02f9804b1	dziennik RJ: dodatkowe info	2023-03-10 16:30:31 +01:00
Spythere	c5efc6fbac	bump: wersja 1.12.2	2023-03-10 02:03:37 +01:00
Spythere	cacd0a1e4e	fix: data stworzenia RJ	2023-03-10 01:53:19 +01:00
Spythere	50375099ab	update url api	2023-03-10 01:42:10 +01:00
Spythere	6af67ec741	fix: tłumaczenia filtrów	2023-03-09 14:35:03 +01:00
Spythere	c64112c86a	dziennik RJ: dodatkowe informacje	2023-03-09 14:28:16 +01:00
Spythere	0434702d3b	update: URL api	2023-03-09 13:41:59 +01:00
Spythere	dd7d1b0bb0	Wersja 1.12.1 Wersja 1.12.1	2023-02-26 14:20:40 +01:00
Spythere	68934a89a4	bump: wersja 1.12.1	2023-02-26 14:16:13 +01:00
Spythere	b88a240ec1	feature: like count historii dyżurnych	2023-02-26 14:14:32 +01:00
Spythere	eaa34f3359	hotfix: dostępność grubości czcionki	2023-02-26 13:50:47 +01:00
Spythere	febb22e1bc	Wersja 1.12 Merge produkcyjny do wersji 1.12.0	2023-02-14 21:32:46 +01:00
Spythere	500f3c1223	dziennik RJ: wyświetlanie statów	2023-02-14 16:57:22 +01:00
Spythere	221e0c7e82	dzienniki: fix ładowania	2023-02-14 16:50:12 +01:00
Spythere	ca19f7e397	hotfix: websocket	2023-02-14 16:40:15 +01:00
Spythere	a71ccd3e1a	bump: wersja 1.12	2023-02-14 13:52:20 +01:00
Spythere	d496c70fa8	aktualizacja tłumaczenia	2023-02-14 13:51:52 +01:00
Spythere	b9868ba52e	dzienniki: stylistyka	2023-02-12 16:12:48 +01:00
Spythere	59bd3fa2ef	design: badge poziomów	2023-02-12 12:58:23 +01:00
Spythere	e14d328ed9	fix: wielkość scrollbaru	2023-02-12 00:48:18 +01:00
Spythere	36d71292bc	feature: url projektów	2023-02-12 00:42:37 +01:00
Spythere	2f6e2e7402	fix: responsywność	2023-02-12 00:30:05 +01:00
Spythere	e959eac6c5	hotfix	2023-02-11 03:14:43 +01:00
Spythere	8bedc4dfc6	feature: vmax szlaków	2023-02-11 03:08:24 +01:00