Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add type tags for number ranges #2284

Merged
merged 3 commits into from
Oct 25, 2023
Merged

Add type tags for number ranges #2284

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
44dee50
Add type tags for number ranges
RunDevelopment Oct 24, 2023
35b6525
Merge branch 'main' into number-range-type-tag
RunDevelopment Oct 25, 2023
45c98d8
Improved range formatting
RunDevelopment Oct 25, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
218 changes: 187 additions & 31 deletions src/renderer/components/TypeTag.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,19 @@
import {
Bounds,
IntIntervalType,
IntervalType,
NeverType,
Type,
intInterval,
isNumericLiteral,
isStringLiteral,
isStructInstance,
isSubsetOf,
} from '@chainner/navi';
import { Tag, Tooltip, forwardRef } from '@chakra-ui/react';
import React, { memo } from 'react';
import React, { ReactNode, memo } from 'react';
import { useTranslation } from 'react-i18next';
import { explain } from '../../common/types/explain';
import { getFields, isColor, isDirectory, isImage, withoutNull } from '../../common/types/util';
import { assertNever } from '../../common/util';

Expand All @@ -24,15 +30,157 @@ const getColorMode = (channels: number) => {
}
};

const getSimplifiedNumberRange = (type: Type): IntIntervalType | IntervalType | undefined => {
if (type.underlying === 'number') {
if (type.type === 'interval' || type.type === 'int-interval') {
return type;
}
if (type.type === 'non-int-interval') {
if (Number.isFinite(type.min) && Number.isFinite(type.max)) {
return new IntervalType(type.min, type.max, Bounds.Inclusive);
}
return new IntervalType(type.min, type.max, Bounds.Exclusive);
}
}
if (type.underlying === 'union') {
let min = Infinity;
let max = -Infinity;

for (const item of type.items) {
if (item.underlying === 'number') {
if (item.type === 'literal') {
const { value } = item;
if (Number.isNaN(value)) {
// we don't deal with nan
return undefined;
}
min = Math.min(min, value);
max = Math.max(max, value);
} else if (item.type === 'number') {
// we don't deal with all numbers
return undefined;
} else {
min = Math.min(min, item.min);
max = Math.max(max, item.max);
}
} else {
return undefined;
}
}

if (min < max) {
if (isSubsetOf(type, intInterval(-Infinity, Infinity))) {
return new IntIntervalType(min, max);
}
return new IntervalType(min, max, Bounds.Inclusive);
}
}
};

const collectNumericLiterals = (type: Type, maximum = 4): number[] | undefined => {
const set = new Set<number>();

const items = type.underlying === 'union' ? type.items : [type];
for (const item of items) {
if (item.underlying === 'number') {
if (item.type === 'literal') {
set.add(item.value);
if (set.size > maximum) {
return undefined;
}
} else if (item.type === 'int-interval') {
const count = item.max - item.min + 1;
if (count + set.size > maximum) {
return undefined;
}
for (let i = item.min; i <= item.max; i += 1) {
set.add(i);
}
} else {
return undefined;
}
} else {
return undefined;
}
}

const list = [...set];
list.sort((a, b) => a - b);
return list;
};

const formatNumber = (n: number): string => {
if (Number.isNaN(n)) return 'nan';
if (n === Infinity) return 'inf';
if (n === -Infinity) return '-inf';
if (Number.isInteger(n)) return n.toString();

const dotPosition = Math.ceil(Math.log10(Math.abs(n)));
const digits = Math.max(dotPosition + 2, 5);
if (digits < 18) {
// eslint-disable-next-line no-param-reassign
n = Number(n.toExponential(digits));
}
return n.toString();
};

type TagValue =
| { kind: 'literal'; value: string }
| { kind: 'literal'; value: string; tooltip?: string }
| { kind: 'string'; value: string }
| { kind: 'path'; value: string };

const getTypeText = (type: Type): TagValue[] => {
if (isNumericLiteral(type)) return [{ kind: 'literal', value: type.toString() }];
if (isStringLiteral(type)) return [{ kind: 'string', value: type.value }];

const numberLiterals = collectNumericLiterals(type, 4);
if (numberLiterals) {
return [{ kind: 'literal', value: numberLiterals.map(formatNumber).join(' | ') }];
}

const rangeType = getSimplifiedNumberRange(type);
if (rangeType) {
const tooltip = explain(rangeType, { detailed: true });
if (rangeType.type === 'interval') {
const { min, max } = rangeType;
if (Number.isFinite(min) && Number.isFinite(max)) {
return [
{
kind: 'literal',
value: `${formatNumber(min)}..${formatNumber(max)}`,
tooltip,
},
];
}
if (Number.isFinite(min) && max === Infinity) {
const op = rangeType.minExclusive ? '>' : '≥';
return [{ kind: 'literal', value: `${op} ${formatNumber(min)}`, tooltip }];
}
if (min === -Infinity && Number.isFinite(max)) {
const op = rangeType.maxExclusive ? '<' : '≤';
return [{ kind: 'literal', value: `${op} ${formatNumber(max)}`, tooltip }];
}
}
if (rangeType.type === 'int-interval') {
const { min, max } = rangeType;
if (Number.isFinite(min) && Number.isFinite(max)) {
return [
{
kind: 'literal',
value: `int ${formatNumber(min)}..${formatNumber(max)}`,
tooltip,
},
];
}
if (Number.isFinite(min) && max === Infinity) {
return [{ kind: 'literal', value: `int ≥ ${formatNumber(min)}`, tooltip }];
}
if (min === -Infinity && Number.isFinite(max)) {
return [{ kind: 'literal', value: `int ≤ ${formatNumber(max)}`, tooltip }];
}
}
}

const tags: TagValue[] = [];
if (isImage(type)) {
const { width, height, channels } = getFields(type);
Expand Down Expand Up @@ -148,49 +296,57 @@ const Punctuation = memo(({ children }: React.PropsWithChildren<unknown>) => {
const TagRenderer = memo(({ tag }: { tag: TagValue }) => {
const { kind, value } = tag;

let tt: string | undefined;
let text: NonNullable<ReactNode>;

switch (kind) {
case 'path': {
tt = value;
const maxLength = 14;
return (
<Tooltip
hasArrow
borderRadius={8}
label={value}
openDelay={500}
px={2}
textAlign="center"
>
<TypeTag>
{value.length > maxLength && <Punctuation>…</Punctuation>}
{value.slice(Math.max(0, value.length - maxLength))}
</TypeTag>
</Tooltip>
text = (
<>
{value.length > maxLength && <Punctuation>…</Punctuation>}
{value.slice(Math.max(0, value.length - maxLength))}
</>
);
break;
}
case 'string': {
tt = value;
const maxLength = 16;
return (
<Tooltip
hasArrow
borderRadius={8}
label={value}
openDelay={500}
px={2}
textAlign="center"
>
<TypeTag>
{value.slice(0, maxLength)}
{value.length > maxLength && <Punctuation>…</Punctuation>}
</TypeTag>
</Tooltip>
text = (
<>
{value.slice(0, maxLength)}
{value.length > maxLength && <Punctuation>…</Punctuation>}
</>
);
break;
}
case 'literal': {
return <TypeTag>{value}</TypeTag>;
tt = tag.tooltip;
text = value;
break;
}
default:
return assertNever(kind);
}

if (!tt) {
return <TypeTag>{text}</TypeTag>;
}

return (
<Tooltip
hasArrow
borderRadius={8}
label={tt}
openDelay={500}
px={2}
textAlign="center"
>
<TypeTag>{text}</TypeTag>
</Tooltip>
);
});

export const TypeTags = memo(({ type, isOptional }: TypeTagsProps) => {
Expand Down