parent
970cf36c94
commit
c51bfbd852
|
@ -1,3 +1,4 @@
|
||||||
|
import {format} from 'date-fns'
|
||||||
import {useCallback, useRef, useState} from 'react'
|
import {useCallback, useRef, useState} from 'react'
|
||||||
import {TextInput, View} from 'react-native'
|
import {TextInput, View} from 'react-native'
|
||||||
import DocumentPicker from 'react-native-document-picker'
|
import DocumentPicker from 'react-native-document-picker'
|
||||||
|
@ -8,7 +9,6 @@ import {getNow, setRepo} from './db'
|
||||||
import GymSet from './gym-set'
|
import GymSet from './gym-set'
|
||||||
import MassiveInput from './MassiveInput'
|
import MassiveInput from './MassiveInput'
|
||||||
import Settings from './settings'
|
import Settings from './settings'
|
||||||
import {format} from './time'
|
|
||||||
import {toast} from './toast'
|
import {toast} from './toast'
|
||||||
|
|
||||||
export default function SetForm({
|
export default function SetForm({
|
||||||
|
@ -129,7 +129,7 @@ export default function SetForm({
|
||||||
<MassiveInput
|
<MassiveInput
|
||||||
label="Created"
|
label="Created"
|
||||||
disabled
|
disabled
|
||||||
value={format(set.created, settings.date)}
|
value={format(new Date(set.created), settings.date)}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{settings.images && newImage && (
|
{settings.images && newImage && (
|
||||||
|
|
|
@ -6,8 +6,8 @@ import {setRepo} from './db'
|
||||||
import GymSet from './gym-set'
|
import GymSet from './gym-set'
|
||||||
import {HomePageParams} from './home-page-params'
|
import {HomePageParams} from './home-page-params'
|
||||||
import Settings from './settings'
|
import Settings from './settings'
|
||||||
import {format} from './time'
|
|
||||||
import useDark from './use-dark'
|
import useDark from './use-dark'
|
||||||
|
import {format} from 'date-fns'
|
||||||
|
|
||||||
export default function SetItem({
|
export default function SetItem({
|
||||||
item,
|
item,
|
||||||
|
@ -66,7 +66,7 @@ export default function SetItem({
|
||||||
alignSelf: 'center',
|
alignSelf: 'center',
|
||||||
color: dark ? '#909090ff' : '#717171ff',
|
color: dark ? '#909090ff' : '#717171ff',
|
||||||
}}>
|
}}>
|
||||||
{format(item.created || '', settings.date)}
|
{format(new Date(item.created), settings.date)}
|
||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
<Menu
|
<Menu
|
||||||
|
|
|
@ -1,9 +1,11 @@
|
||||||
import {Picker} from '@react-native-picker/picker'
|
import {Picker} from '@react-native-picker/picker'
|
||||||
|
import DeviceTimeFormat from 'react-native-device-time-format'
|
||||||
import {useFocusEffect} from '@react-navigation/native'
|
import {useFocusEffect} from '@react-navigation/native'
|
||||||
|
import {format} from 'date-fns'
|
||||||
import {useCallback, useMemo, useState} from 'react'
|
import {useCallback, useMemo, useState} from 'react'
|
||||||
import {DeviceEventEmitter, FlatList, NativeModules, View} from 'react-native'
|
import {DeviceEventEmitter, FlatList, NativeModules, View} from 'react-native'
|
||||||
import DocumentPicker from 'react-native-document-picker'
|
import DocumentPicker from 'react-native-document-picker'
|
||||||
import {Button} from 'react-native-paper'
|
import {Button, Text} from 'react-native-paper'
|
||||||
import {darkColors, lightColors} from './colors'
|
import {darkColors, lightColors} from './colors'
|
||||||
import ConfirmDialog from './ConfirmDialog'
|
import ConfirmDialog from './ConfirmDialog'
|
||||||
import {MARGIN} from './constants'
|
import {MARGIN} from './constants'
|
||||||
|
@ -31,6 +33,8 @@ export default function SettingsPage() {
|
||||||
const {theme, setTheme, color, setColor} = useTheme()
|
const {theme, setTheme, color, setColor} = useTheme()
|
||||||
const [showDate, setShowDate] = useState(false)
|
const [showDate, setShowDate] = useState(false)
|
||||||
const [noSound, setNoSound] = useState(false)
|
const [noSound, setNoSound] = useState(false)
|
||||||
|
const [formatOptions, setFormatOptions] = useState<string[]>([])
|
||||||
|
const today = new Date()
|
||||||
|
|
||||||
useFocusEffect(
|
useFocusEffect(
|
||||||
useCallback(() => {
|
useCallback(() => {
|
||||||
|
@ -47,6 +51,10 @@ export default function SettingsPage() {
|
||||||
setShowDate(settings.showDate)
|
setShowDate(settings.showDate)
|
||||||
setNoSound(settings.noSound)
|
setNoSound(settings.noSound)
|
||||||
})
|
})
|
||||||
|
DeviceTimeFormat.is24HourFormat().then(is24 => {
|
||||||
|
if (is24) return setFormatOptions(['P', 'P, k:m', 'ccc k:m', 'k:m'])
|
||||||
|
setFormatOptions(['P', 'Pp', 'ccc p', 'p'])
|
||||||
|
})
|
||||||
}, []),
|
}, []),
|
||||||
)
|
)
|
||||||
|
|
||||||
|
@ -230,18 +238,13 @@ export default function SettingsPage() {
|
||||||
)}
|
)}
|
||||||
{'date format'.includes(term.toLowerCase()) && (
|
{'date format'.includes(term.toLowerCase()) && (
|
||||||
<Select value={date} onChange={changeDate}>
|
<Select value={date} onChange={changeDate}>
|
||||||
<Picker.Item value="%Y-%m-%d %H:%M" label="1990-12-24 15:05" />
|
{formatOptions.map(option => (
|
||||||
<Picker.Item value="%Y-%m-%d" label="1990-12-24" />
|
|
||||||
<Picker.Item value="%d/%m" label="24/12 (dd/MM)" />
|
|
||||||
<Picker.Item value="%H:%M" label="15:05 (24-hour time)" />
|
|
||||||
<Picker.Item value="%h:%M %p" label="3:05 PM (12-hour time)" />
|
|
||||||
<Picker.Item value="%d/%m/%y" label="24/12/1996" />
|
|
||||||
<Picker.Item value="%A %h:%M %p" label="Monday 3:05 PM" />
|
|
||||||
<Picker.Item
|
<Picker.Item
|
||||||
value="%d/%m/%y %h:%M %p"
|
key={option}
|
||||||
label="24/12/1990 3:05 PM"
|
value={option}
|
||||||
|
label={format(today, option)}
|
||||||
/>
|
/>
|
||||||
<Picker.Item value="%d/%m %h:%M %p" label="24/12 3:05 PM" />
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
)}
|
)}
|
||||||
{'alarm sound'.includes(term.toLowerCase()) && (
|
{'alarm sound'.includes(term.toLowerCase()) && (
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import {Picker} from '@react-native-picker/picker'
|
import {Picker} from '@react-native-picker/picker'
|
||||||
import {RouteProp, useRoute} from '@react-navigation/native'
|
import {RouteProp, useRoute} from '@react-navigation/native'
|
||||||
|
import {format} from 'date-fns'
|
||||||
import {useEffect, useState} from 'react'
|
import {useEffect, useState} from 'react'
|
||||||
import {View} from 'react-native'
|
import {View} from 'react-native'
|
||||||
import {BestPageParams} from './BestPage'
|
import {BestPageParams} from './BestPage'
|
||||||
|
@ -10,7 +11,6 @@ import GymSet from './gym-set'
|
||||||
import {Metrics} from './metrics'
|
import {Metrics} from './metrics'
|
||||||
import {Periods} from './periods'
|
import {Periods} from './periods'
|
||||||
import StackHeader from './StackHeader'
|
import StackHeader from './StackHeader'
|
||||||
import {formatMonth} from './time'
|
|
||||||
import useDark from './use-dark'
|
import useDark from './use-dark'
|
||||||
import Volume from './volume'
|
import Volume from './volume'
|
||||||
|
|
||||||
|
@ -94,7 +94,9 @@ export default function ViewBest() {
|
||||||
}`
|
}`
|
||||||
}
|
}
|
||||||
xData={weights}
|
xData={weights}
|
||||||
xFormat={(_value, index) => formatMonth(weights[index].created!)}
|
xFormat={(_value, index) =>
|
||||||
|
format(new Date(weights[index].created), 'D/M')
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<Chart
|
<Chart
|
||||||
|
|
34
migrations/1668215159730-update-date.ts
Normal file
34
migrations/1668215159730-update-date.ts
Normal file
|
@ -0,0 +1,34 @@
|
||||||
|
import {MigrationInterface, QueryRunner} from 'typeorm'
|
||||||
|
import {settingsRepo} from '../db'
|
||||||
|
|
||||||
|
export class updateDate1668215159730 implements MigrationInterface {
|
||||||
|
public async up(queryRunner: QueryRunner): Promise<void> {
|
||||||
|
const settings = await settingsRepo.findOne({where: {}})
|
||||||
|
let newDate = 'P'
|
||||||
|
switch (settings.date) {
|
||||||
|
case '%Y-%m-%d %H:%M':
|
||||||
|
case '%d/%m/%y %h:%M %p':
|
||||||
|
case '%d/%m %h:%M %p':
|
||||||
|
newDate = 'Pp'
|
||||||
|
break
|
||||||
|
case '%Y-%m-%d':
|
||||||
|
case '%d/%m/%y':
|
||||||
|
case '%d/%m':
|
||||||
|
newDate = 'P'
|
||||||
|
break
|
||||||
|
case '%H:%M':
|
||||||
|
case '%h:%M %p':
|
||||||
|
newDate = 'p'
|
||||||
|
break
|
||||||
|
case '%A %h:%M %p':
|
||||||
|
newDate = 'cccc p'
|
||||||
|
break
|
||||||
|
}
|
||||||
|
settings.date = newDate
|
||||||
|
await settingsRepo.save(settings)
|
||||||
|
}
|
||||||
|
|
||||||
|
public async down(queryRunner: QueryRunner): Promise<void> {
|
||||||
|
// There's no going back...
|
||||||
|
}
|
||||||
|
}
|
|
@ -27,10 +27,12 @@
|
||||||
"@types/react-native-vector-icons": "^6.4.12",
|
"@types/react-native-vector-icons": "^6.4.12",
|
||||||
"babel-jest": "^29.2.2",
|
"babel-jest": "^29.2.2",
|
||||||
"babel-plugin-transform-remove-console": "^6.9.4",
|
"babel-plugin-transform-remove-console": "^6.9.4",
|
||||||
|
"date-fns": "^2.29.3",
|
||||||
"eslint-plugin-flowtype": "^8.0.3",
|
"eslint-plugin-flowtype": "^8.0.3",
|
||||||
"jest": "^29.2.2",
|
"jest": "^29.2.2",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-native": "^0.70.5",
|
"react-native": "^0.70.5",
|
||||||
|
"react-native-device-time-format": "^2.3.0",
|
||||||
"react-native-document-picker": "^8.1.2",
|
"react-native-document-picker": "^8.1.2",
|
||||||
"react-native-file-access": "^2.5.0",
|
"react-native-file-access": "^2.5.0",
|
||||||
"react-native-gesture-handler": "^2.8.0",
|
"react-native-gesture-handler": "^2.8.0",
|
||||||
|
|
52
time.ts
52
time.ts
|
@ -7,55 +7,3 @@ export const DAYS = [
|
||||||
'Friday',
|
'Friday',
|
||||||
'Saturday',
|
'Saturday',
|
||||||
]
|
]
|
||||||
|
|
||||||
export function formatMonth(iso: string) {
|
|
||||||
const date = new Date(iso)
|
|
||||||
const dd = date.getDate().toString()
|
|
||||||
const mm = (date.getMonth() + 1).toString()
|
|
||||||
return `${dd}/${mm}`
|
|
||||||
}
|
|
||||||
|
|
||||||
function twelveHour(twentyFourHour: string) {
|
|
||||||
const [hourString, minute] = twentyFourHour.split(':')
|
|
||||||
const hour = +hourString % 24
|
|
||||||
return (hour % 12 || 12) + ':' + minute + (hour < 12 ? ' AM' : ' PM')
|
|
||||||
}
|
|
||||||
|
|
||||||
function dayOfWeek(iso: string) {
|
|
||||||
const date = new Date(iso)
|
|
||||||
const day = date.getDay()
|
|
||||||
const target = DAYS[day]
|
|
||||||
return target.slice(0, 3)
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @param iso ISO formatted date, e.g. 1996-12-24T14:03:04
|
|
||||||
* @param kind Intended format for the date, e.g. '%Y-%m-%d %H:%M'
|
|
||||||
*/
|
|
||||||
export function format(iso: string, kind: string) {
|
|
||||||
const split = iso.split('T')
|
|
||||||
const [year, month, day] = split[0].split('-')
|
|
||||||
const time = twelveHour(split[1])
|
|
||||||
switch (kind) {
|
|
||||||
case '%Y-%m-%d %H:%M':
|
|
||||||
return iso.replace('T', ' ').replace(/:\d{2}/, '')
|
|
||||||
case '%Y-%m-%d':
|
|
||||||
return split[0]
|
|
||||||
case '%H:%M':
|
|
||||||
return split[1].replace(/:\d{2}/, '')
|
|
||||||
case '%d/%m/%y %h:%M %p':
|
|
||||||
return `${day}/${month}/${year} ${time}`
|
|
||||||
case '%d/%m %h:%M %p':
|
|
||||||
return `${day}/${month} ${time}`
|
|
||||||
case '%d/%m/%y':
|
|
||||||
return `${day}/${month}/${year}`
|
|
||||||
case '%d/%m':
|
|
||||||
return `${day}/${month}`
|
|
||||||
case '%h:%M %p':
|
|
||||||
return time
|
|
||||||
case '%A %h:%M %p':
|
|
||||||
return dayOfWeek(iso) + ' ' + time
|
|
||||||
default:
|
|
||||||
return iso
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
11
yarn.lock
11
yarn.lock
|
@ -4259,7 +4259,7 @@ __metadata:
|
||||||
languageName: node
|
languageName: node
|
||||||
linkType: hard
|
linkType: hard
|
||||||
|
|
||||||
"date-fns@npm:^2.28.0":
|
"date-fns@npm:^2.28.0, date-fns@npm:^2.29.3":
|
||||||
version: 2.29.3
|
version: 2.29.3
|
||||||
resolution: "date-fns@npm:2.29.3"
|
resolution: "date-fns@npm:2.29.3"
|
||||||
checksum: e01cf5b62af04e05dfff921bb9c9933310ed0e1ae9a81eb8653452e64dc841acf7f6e01e1a5ae5644d0337e9a7f936175fd2cb6819dc122fdd9c5e86c56be484
|
checksum: e01cf5b62af04e05dfff921bb9c9933310ed0e1ae9a81eb8653452e64dc841acf7f6e01e1a5ae5644d0337e9a7f936175fd2cb6819dc122fdd9c5e86c56be484
|
||||||
|
@ -7300,12 +7300,14 @@ __metadata:
|
||||||
"@typescript-eslint/parser": ^5.29.0
|
"@typescript-eslint/parser": ^5.29.0
|
||||||
babel-jest: ^29.2.2
|
babel-jest: ^29.2.2
|
||||||
babel-plugin-transform-remove-console: ^6.9.4
|
babel-plugin-transform-remove-console: ^6.9.4
|
||||||
|
date-fns: ^2.29.3
|
||||||
eslint: ^8.26.0
|
eslint: ^8.26.0
|
||||||
eslint-plugin-flowtype: ^8.0.3
|
eslint-plugin-flowtype: ^8.0.3
|
||||||
jest: ^29.2.2
|
jest: ^29.2.2
|
||||||
metro-react-native-babel-preset: ^0.73.3
|
metro-react-native-babel-preset: ^0.73.3
|
||||||
react: ^18.2.0
|
react: ^18.2.0
|
||||||
react-native: ^0.70.5
|
react-native: ^0.70.5
|
||||||
|
react-native-device-time-format: ^2.3.0
|
||||||
react-native-document-picker: ^8.1.2
|
react-native-document-picker: ^8.1.2
|
||||||
react-native-file-access: ^2.5.0
|
react-native-file-access: ^2.5.0
|
||||||
react-native-gesture-handler: ^2.8.0
|
react-native-gesture-handler: ^2.8.0
|
||||||
|
@ -8794,6 +8796,13 @@ __metadata:
|
||||||
languageName: node
|
languageName: node
|
||||||
linkType: hard
|
linkType: hard
|
||||||
|
|
||||||
|
"react-native-device-time-format@npm:^2.3.0":
|
||||||
|
version: 2.3.0
|
||||||
|
resolution: "react-native-device-time-format@npm:2.3.0"
|
||||||
|
checksum: c19e20f40be82fff2d0c812124303e4607c3553103ddc7d672cc277e19c9ed418af81955be3c6dc9b273c417eb504d511847245952124374fb9546a68aa16efa
|
||||||
|
languageName: node
|
||||||
|
linkType: hard
|
||||||
|
|
||||||
"react-native-document-picker@npm:^8.1.2":
|
"react-native-document-picker@npm:^8.1.2":
|
||||||
version: 8.1.2
|
version: 8.1.2
|
||||||
resolution: "react-native-document-picker@npm:8.1.2"
|
resolution: "react-native-document-picker@npm:8.1.2"
|
||||||
|
|
Loading…
Reference in New Issue
Block a user