lines for dates
This commit is contained in:
parent
d7f9b1f5ee
commit
498a562b07
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import { ContextTooltip } from "@budibase/bbui"
|
||||
import { ScalarJsonOnly, Column, Support, NotRequired, StringsAsNumbers, DatesAsNumbers } from './subjects'
|
||||
import { StringsAsDates, NumbersAsDates, ScalarJsonOnly, Column, Support, NotRequired, StringsAsNumbers, DatesAsNumbers } from './subjects'
|
||||
import subjects from '../subjects'
|
||||
|
||||
export let anchor
|
||||
|
@ -29,6 +29,10 @@
|
|||
<DatesAsNumbers />
|
||||
{:else if subject === subjects.scalarJsonOnly}
|
||||
<ScalarJsonOnly {columnName} {schema} />
|
||||
{:else if subject === subjects.numbersAsDates}
|
||||
<NumbersAsDates {columnName} />
|
||||
{:else if subject === subjects.stringsAsDates}
|
||||
<StringsAsDates {columnName} />
|
||||
{/if}
|
||||
</div>
|
||||
</ContextTooltip>
|
||||
|
|
|
@ -2,9 +2,6 @@
|
|||
import { tables } from "stores/builder"
|
||||
import { BindingValue, Block, Subject, JSONValue, Property, Section } from './components'
|
||||
|
||||
$: {
|
||||
console.log($tables)
|
||||
}
|
||||
export let schema
|
||||
export let columnName
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
|
||||
<Subject heading="Dates as Numbers">
|
||||
<Section>
|
||||
A date can be used in place of a numeric value, but it will be parsed as a <Block>UNIX time</Block> timestamp, which is the number of milliseconds since Jan 1st 1970. A more recent moment in time will be a higher number.
|
||||
A date can be used in place of a numeric value, but it will be converted to a <Block>UNIX time</Block> timestamp, which is the number of milliseconds since Jan 1st 1970. A more recent moment in time will be a higher number.
|
||||
</Section>
|
||||
|
||||
<ExampleSection
|
||||
|
|
|
@ -0,0 +1,9 @@
|
|||
|
||||
<script>
|
||||
</script>
|
||||
|
||||
<div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -34,7 +34,7 @@
|
|||
|
||||
<Subject heading="Using Scalar JSON Values">
|
||||
<Section>
|
||||
<Block>JSON objects</Block> can't be used here, but any <Block>number</Block>, <Block>string</Block> or <Block>boolean</Block> values nested within said object can be if they are otherwise compatible with the component. These scalar values can be selected from the same menu as this parent and take the form <Block>parent.child</Block>.
|
||||
<Block>JSON objects</Block> can't be used here, but any <Block>number</Block>, <Block>string</Block> or <Block>boolean</Block> values nested within said object can be if they are otherwise compatible with the input. These scalar values can be selected from the same menu as this parent and take the form <Block>parent.child</Block>.
|
||||
</Section>
|
||||
|
||||
{#if scalarDescendants.length > 0}
|
||||
|
|
|
@ -10,15 +10,15 @@
|
|||
color="var(--green)"
|
||||
text="Compatible"
|
||||
/>
|
||||
<span class="body">Fully compatible with the component as long as the data is present.</span>
|
||||
<span class="body">Fully compatible with the input as long as the data is present.</span>
|
||||
</Section>
|
||||
<Section>
|
||||
<InfoWord
|
||||
icon="AlertCheck"
|
||||
color="var(--yellow)"
|
||||
text="Possibly compatible"
|
||||
text="Partially compatible"
|
||||
/>
|
||||
<span class="body">Possibly compatible with the component, but beware of other caveats mentioned in the context tooltip.</span>
|
||||
<span class="body">Partially compatible with the input, but beware of other caveats mentioned.</span>
|
||||
</Section>
|
||||
<Section>
|
||||
<InfoWord
|
||||
|
|
|
@ -4,3 +4,5 @@ export { default as StringsAsNumbers } from "./StringsAsNumbers.svelte"
|
|||
export { default as Support } from "./Support.svelte"
|
||||
export { default as DatesAsNumbers } from "./DatesAsNumbers.svelte"
|
||||
export { default as ScalarJsonOnly } from "./ScalarJsonOnly.svelte"
|
||||
export { default as StringsAsDates } from "./StringsAsDates.svelte"
|
||||
export { default as NumbersAsDates } from "./NumbersAsDates.svelte"
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<script>
|
||||
import DetailsModal from './DetailsModal/index.svelte'
|
||||
import { messages as messageConstants, getExplanationMessagesAndSupport, getExplanationWithPresets } from "./explanation";
|
||||
import { Column, Support, NotRequired, StringNumber, JSONPrimitivesOnly, DateAsNumber } from "./lines"
|
||||
import { StringAsDate, NumberAsDate, Column, Support, NotRequired, StringAsNumber, JSONPrimitivesOnly, DateAsNumber } from "./lines"
|
||||
import subjects from './subjects';
|
||||
import {
|
||||
componentStore,
|
||||
|
@ -53,7 +53,7 @@
|
|||
{setExplanationSubject}
|
||||
/>
|
||||
{#if messages.includes(messageConstants.stringAsNumber)}
|
||||
<StringNumber
|
||||
<StringAsNumber
|
||||
{setExplanationSubject}
|
||||
/>
|
||||
{/if}
|
||||
|
@ -72,6 +72,16 @@
|
|||
{setExplanationSubject}
|
||||
/>
|
||||
{/if}
|
||||
{#if messages.includes(messageConstants.numberAsDate)}
|
||||
<NumberAsDate
|
||||
{setExplanationSubject}
|
||||
/>
|
||||
{/if}
|
||||
{#if messages.includes(messageConstants.stringAsDate)}
|
||||
<StringAsDate
|
||||
{setExplanationSubject}
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
{#if showDetails}
|
||||
|
|
|
@ -4,6 +4,8 @@ export const messages = {
|
|||
jsonPrimitivesOnly: Symbol("explanation-json-primitives-only"),
|
||||
stringAsNumber: Symbol("explanation-string-as-number"),
|
||||
dateAsNumber: Symbol("explanation-date-as-number"),
|
||||
numberAsDate: Symbol("explanation-number-as-date"),
|
||||
stringAsDate: Symbol("explanation-string-as-date"),
|
||||
notRequired: Symbol("explanation-not-required"),
|
||||
contextError: Symbol("explanation-context-error"),
|
||||
}
|
||||
|
|
|
@ -6,11 +6,11 @@
|
|||
</script>
|
||||
|
||||
<Line>
|
||||
<Text value="Will be parsed as a " />
|
||||
<Text value="Will be converted to a " />
|
||||
<InfoWord
|
||||
on:mouseenter={() => setExplanationSubject(subjects.datesAsNumbers)}
|
||||
on:mouseleave={() => setExplanationSubject(subjects.none)}
|
||||
text="UNIX epoch timestamp"
|
||||
text="UNIX time value"
|
||||
/>
|
||||
<Period />
|
||||
</Line>
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
on:mouseleave={() => setExplanationSubject(subjects.none)}
|
||||
>Scalar JSON values</InfoWord>
|
||||
<Text
|
||||
value=" can be used with this component if their individual types are supported"
|
||||
value=" can be used with this input if their individual types are supported"
|
||||
/>
|
||||
<Period />
|
||||
</Line>
|
||||
|
|
|
@ -0,0 +1,16 @@
|
|||
<script>
|
||||
import { Line, InfoWord, DocumentationLink, Space, Text, Period } from "../typography"
|
||||
import subjects from '../subjects'
|
||||
|
||||
export let setExplanationSubject
|
||||
</script>
|
||||
|
||||
<Line>
|
||||
<Text value="Will be treated as a " />
|
||||
<InfoWord
|
||||
on:mouseenter={() => setExplanationSubject(subjects.numbersAsDates)}
|
||||
on:mouseleave={() => setExplanationSubject(subjects.none)}
|
||||
text="UNIX time value"
|
||||
/>
|
||||
<Period />
|
||||
</Line>
|
|
@ -0,0 +1,16 @@
|
|||
<script>
|
||||
import { Line, InfoWord, DocumentationLink, Space, Text, Period } from "../typography"
|
||||
import subjects from '../subjects'
|
||||
|
||||
export let setExplanationSubject
|
||||
</script>
|
||||
|
||||
<Line>
|
||||
<Text value="Will be treated as a " />
|
||||
<InfoWord
|
||||
on:mouseenter={() => setExplanationSubject(subjects.stringsAsDates)}
|
||||
on:mouseleave={() => setExplanationSubject(subjects.none)}
|
||||
text="UNIX time or ISO 8601 value"
|
||||
/>
|
||||
<Period />
|
||||
</Line>
|
|
@ -6,7 +6,7 @@
|
|||
</script>
|
||||
|
||||
<Line>
|
||||
<Text value="The component will ignore any " />
|
||||
<Text value="The input will ignore any " />
|
||||
<InfoWord
|
||||
on:mouseenter={() => setExplanationSubject(subjects.stringsAsNumbers)}
|
||||
on:mouseleave={() => setExplanationSubject(subjects.none)}
|
|
@ -49,11 +49,11 @@
|
|||
{color}
|
||||
{text}
|
||||
/>
|
||||
<Text value=" with " />
|
||||
<Text value=" with this " />
|
||||
<DocumentationLink
|
||||
href="https://docs.budibase.com/docs/chart"
|
||||
icon="GraphPie"
|
||||
text="Chart components"
|
||||
text="Chart component"
|
||||
/>
|
||||
<Period />
|
||||
<Text value=" input." />
|
||||
</Line>
|
||||
|
|
|
@ -1,6 +1,8 @@
|
|||
export { default as Column } from "./Column.svelte"
|
||||
export { default as NotRequired } from "./NotRequired.svelte"
|
||||
export { default as StringNumber } from "./StringNumber.svelte"
|
||||
export { default as StringAsNumber } from "./StringAsNumber.svelte"
|
||||
export { default as Support } from "./Support.svelte"
|
||||
export { default as JSONPrimitivesOnly } from "./JSONPrimitivesOnly.svelte"
|
||||
export { default as DateAsNumber } from "./DateAsNumber.svelte"
|
||||
export { default as NumberAsDate } from "./NumberAsDate.svelte"
|
||||
export { default as StringAsDate } from "./StringAsDate.svelte"
|
||||
|
|
|
@ -3,6 +3,8 @@ const subjects = {
|
|||
support: Symbol("details-modal-support"),
|
||||
stringsAsNumbers: Symbol("details-modal-strings-as-numbers"),
|
||||
datesAsNumbers: Symbol("details-modal-dates-as-numbers"),
|
||||
numbersAsDates: Symbol("explanation-numbers-as-dates"),
|
||||
stringsAsDates: Symbol("explanation-strings-as-dates"),
|
||||
notRequired: Symbol("details-modal-not-required"),
|
||||
scalarJsonOnly: Symbol("explanation-scalar-json-only"),
|
||||
none: Symbol("details-modal-none")
|
||||
|
|
|
@ -16,10 +16,6 @@
|
|||
export let placeholder
|
||||
export let explanation
|
||||
|
||||
$: {
|
||||
console.log($componentStore);
|
||||
}
|
||||
|
||||
let contextTooltipAnchor = null
|
||||
let currentOption = null
|
||||
let previousOption = null
|
||||
|
|
|
@ -95,7 +95,6 @@ export class ComponentStore extends BudiStore {
|
|||
// Fetch definitions and filter out custom component definitions so we
|
||||
// can flag them
|
||||
const components = await API.fetchComponentLibDefinitions(appId)
|
||||
console.log(components);
|
||||
const customComponents = Object.keys(components).filter(key =>
|
||||
key.startsWith("plugin/")
|
||||
)
|
||||
|
|
|
@ -28,20 +28,6 @@
|
|||
{ "type": "json", "message": "jsonPrimitivesOnly" }
|
||||
]
|
||||
},
|
||||
"datetimeLike": {
|
||||
"supported": ["datetime"],
|
||||
"partialSupport": [
|
||||
{ "type": "longform", "message": "stringAsDate" },
|
||||
{ "type": "string", "message": "stringAsDate" },
|
||||
{ "type": "options", "message": "stringAsDate" },
|
||||
{ "type": "formula", "message": "stringAsDate" },
|
||||
{ "type": "bigint", "message": "stringAsDate" },
|
||||
{ "type": "number", "message": "numberAsDate"}
|
||||
],
|
||||
"unsupported": [
|
||||
{ "type": "json", "message": "jsonPrimitivesOnly" }
|
||||
]
|
||||
},
|
||||
"stringLike": {
|
||||
"supported": ["string", "number", "bigint", "options", "longform", "boolean", "datetime"],
|
||||
"unsupported": [
|
||||
|
@ -2427,6 +2413,22 @@
|
|||
"label": "Date column",
|
||||
"key": "dateColumn",
|
||||
"dependsOn": "dataProvider",
|
||||
"explanation": {
|
||||
"typeSupport": {
|
||||
"supported": ["datetime"],
|
||||
"partialSupport": [
|
||||
{ "type": "longform", "message": "stringAsDate" },
|
||||
{ "type": "string", "message": "stringAsDate" },
|
||||
{ "type": "options", "message": "stringAsDate" },
|
||||
{ "type": "formula", "message": "stringAsDate" },
|
||||
{ "type": "bigint", "message": "stringAsDate" },
|
||||
{ "type": "number", "message": "numberAsDate"}
|
||||
],
|
||||
"unsupported": [
|
||||
{ "type": "json", "message": "jsonPrimitivesOnly" }
|
||||
]
|
||||
}
|
||||
},
|
||||
"required": true
|
||||
},
|
||||
{
|
||||
|
|
|
@ -28,10 +28,19 @@
|
|||
}
|
||||
|
||||
const renderChart = async (newChartElement) => {
|
||||
await chart?.destroy()
|
||||
chart = new ApexCharts(newChartElement, optionsCopy)
|
||||
currentType = optionsCopy?.xaxis?.type
|
||||
await chart.render()
|
||||
try {
|
||||
await chart?.destroy()
|
||||
chart = new ApexCharts(newChartElement, optionsCopy)
|
||||
currentType = optionsCopy?.xaxis?.type
|
||||
await chart.render()
|
||||
} catch (e) {
|
||||
// Apex for some reason throws this error when creating a new chart.
|
||||
// It doesn't actually cause any issues with the function of the chart, so
|
||||
// just suppress it so the console doesn't get spammed
|
||||
if (e.message !== "Cannot read properties of undefined (reading 'parentNode')") {
|
||||
throw e
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$: noData = optionsCopy == null || optionsCopy?.series?.length === 0
|
||||
|
|
Loading…
Reference in New Issue