Merge pull request #7470 from kodadot/beta

components/TheFooter.vue

@@ -226,6 +226,16 @@ const menuKodadot: Menu[] = [
  url: '/blog',
  external: false,
  },
+ {
+ name: $i18n.t('footer.privacyPolicy'),
+ url: '/privacy-policy',
+ external: false,
+ },
+ {
+ name: $i18n.t('footer.toc'),
+ url: '/terms-of-use',
+ external: false,
+ },
 ]
 
 const socials = [

components/collection/activity/ActivityChart.vue

@@ -12,11 +12,14 @@ import PriceChart from '@/components/chart/PriceChart.vue'
 import {
  bin,
  displayValue,
+ getBinSizeForRange,
  removeOutliers,
  sortAsc,
  toDataPoint,
 } from './utils'
 
+const { decimals } = useChain()
+
 const props = withDefaults(
  defineProps<{
  events: ActivityInteraction[]
@@ -43,16 +46,22 @@ const listEvents = computed(() => {
 })
 
 const chartData = computed(() => {
- const buyBins = bin(buyEvents.value, { days: 1 })
- const listBins = bin(listEvents.value, { days: 1 })
+ const buyBinSize = getBinSizeForRange({
+ timestamps: buyEvents.value.map((e) => e.timestamp),
+ })
+ const listBinSize = getBinSizeForRange({
+ timestamps: listEvents.value.map((e) => e.timestamp),
+ })
+ const buyBins = bin(buyEvents.value, buyBinSize)
+ const listBins = bin(listEvents.value, listBinSize)
 
  const binnedBuyEvents = buyBins.map(({ timestamp, value }) => [
  new Date(timestamp),
- displayValue(value),
+ displayValue(value, decimals.value),
  ])
  const binnedListEvents = listBins.map(({ timestamp, value }) => [
  new Date(timestamp),
- displayValue(value),
+ displayValue(value, decimals.value),
  ])
 
  return [binnedBuyEvents, binnedListEvents]

components/collection/activity/events/Events.vue

@@ -27,11 +27,17 @@
 
  <template #rows="{ variant }">
  <EventRow
- v-for="(event, i) in displayedEvents"
+ v-for="(event, i) in displayedEvents.slice(
+ 0,
+ displayedEvents.length - 1
+ )"
  :key="i"
  :variant="variant"
  :event="event" />
  <div ref="sentinel" />
+ <EventRow
+ :variant="variant"
+ :event="displayedEvents[displayedEvents.length - 1]" />
  </template>
  </ResponsiveTable>
 </template>
@@ -97,11 +103,13 @@ watch(
 
 const handleIntersection = (entries: IntersectionObserverEntry[]) => {
  const target = entries[0]
- if (target.isIntersecting) {
+ if (
+ target.isIntersecting &&
+ displayedEvents.value.length < filteredEvents.value.length
+ ) {
  displayMoreEvents()
  }
 }
-
 const sentinel = ref<HTMLDivElement | null>(null)
 useIntersectionObserver(sentinel, handleIntersection, { threshold: 0.66 })
 </script>

components/collection/activity/utils.ts

@@ -24,8 +24,8 @@ export const toDataPoint = (e: {
 export const sortAsc = (events: DataPoint[]) =>
  events.sort((a, b) => a.timestamp - b.timestamp)
 
-export const displayValue = (val: number) =>
- Number((val * Math.pow(10, -12)).toFixed(4))
+export const displayValue = (val: number, decimals: number) =>
+ Number((val * Math.pow(10, -1 * decimals)).toFixed(4))
 
 const binSizeToMillis = (binSize: BinSize): number => {
  const millisInMinute = 60 * 1000
@@ -42,6 +42,55 @@ const binSizeToMillis = (binSize: BinSize): number => {
  return millis || millisInDay // Default bin size is one day
 }
 
+function millisToBinSize(millis: number): BinSize {
+ const minuteMillis = 60000
+ const hourMillis = 60 * minuteMillis
+ const dayMillis = 24 * hourMillis
+ const weekMillis = 7 * dayMillis
+
+ const weeks = Math.floor(millis / weekMillis)
+ millis -= weeks * weekMillis
+
+ const days = Math.floor(millis / dayMillis)
+ millis -= days * dayMillis
+
+ const hours = Math.floor(millis / hourMillis)
+ millis -= hours * hourMillis
+
+ const minutes = Math.ceil(millis / minuteMillis)
+
+ return {
+ weeks: weeks || undefined,
+ days: days || undefined,
+ hours: hours || undefined,
+ minutes: minutes || undefined,
+ }
+}
+
+export const getBinSizeForRange = ({
+ timestamps,
+ sampleRate = 2,
+ sort = false,
+}: {
+ timestamps: number[]
+ sampleRate?: number
+ sort?: boolean
+}): BinSize => {
+ if (timestamps.length < 2) {
+ return { minutes: 1 }
+ }
+
+ const minTimestamp = sort ? Math.min(...timestamps) : timestamps[0]
+ const maxTimestamp = sort
+ ? Math.max(...timestamps)
+ : timestamps[timestamps.length - 1]
+
+ const totalMillis = maxTimestamp - minTimestamp
+ const idealBinSizeMillis = totalMillis / (timestamps.length * sampleRate)
+
+ return millisToBinSize(idealBinSizeMillis)
+}
+
 const mean = (arr: DataPoint[]): number => {
  const sum = arr.reduce((total, { value }) => total + value, 0)
  return sum / arr.length

locales/en.json

@@ -1100,7 +1100,9 @@
  "footer": {
  "subscribe": "Get The Latest KodaDot Updates",
  "join": "Join Our Community",
- "subscribeLabel": "Subscribe"
+ "subscribeLabel": "Subscribe",
+ "toc": "Terms of Use",
+ "privacyPolicy": "Privacy Policy"
  },
  "share": {
  "copyLink": "Copy Link",