ByoungSooPark/modeling-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve Prop Typings for Modals. Remove instances of any. (#792)

Browse Source 
* Update typings for modals. Remove instances of `any`

* Fix generic type for creating modals
This commit is contained in:
Jason Rametta
2023-10-06 16:34:21 -04:00
committed by GitHub
parent 89b880d9ae
commit 629f326f4c
9 changed files with 210 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/SetAngleLengthModal.tsx
View File

@ -1,5 +1,6 @@
import { Dialog, Transition } from '@headlessui/react'
import { Fragment, useState } from 'react'
import { type InstanceProps, create } from 'react-modal-promise'
import { Value } from '../lang/wasm'
import {
AvailableVars,
@ -9,6 +10,28 @@ import {
CreateNewVariable,
} from './AvailableVarsHelpers'
type ModalResolve = {
value: string
sign: number
valueNode: Value
variableName?: string
newVariableInsertIndex: number
}
type ModalReject = boolean
type SetAngleLengthModalProps = InstanceProps<ModalResolve, ModalReject> & {
value: number
valueName: string
shouldCreateVariable?: boolean
}
export const createSetAngleLengthModal = create<
SetAngleLengthModalProps,
ModalResolve,
ModalReject
>
export const SetAngleLengthModal = ({
isOpen,
onResolve,
@ -16,20 +39,7 @@ export const SetAngleLengthModal = ({
value: initialValue,
valueName,
shouldCreateVariable: initialShouldCreateVariable = false,
}: {
isOpen: boolean
onResolve: (a: {
value: string
sign: number
valueNode: Value
variableName?: string
newVariableInsertIndex: number
}) => void
onReject: (a: any) => void
value: number
valueName: string
shouldCreateVariable: boolean
}) => {
}: SetAngleLengthModalProps) => {
const [sign, setSign] = useState(Math.sign(Number(initialValue)))
const [value, setValue] = useState(String(initialValue * sign))
const [shouldCreateVariable, setShouldCreateVariable] = useState(

46
src/components/SetHorVertDistanceModal.tsx
View File

@ -1,5 +1,6 @@
import { Dialog, Transition } from '@headlessui/react'
import { Fragment, useState } from 'react'
import { type InstanceProps, create } from 'react-modal-promise'
import { Value } from '../lang/wasm'
import {
AvailableVars,
@ -9,6 +10,30 @@ import {
CreateNewVariable,
} from './AvailableVarsHelpers'
type ModalResolve = {
value: string
segName: string
valueNode: Value
variableName?: string
newVariableInsertIndex: number
sign: number
}
type ModalReject = boolean
type GetInfoModalProps = InstanceProps<ModalResolve, ModalReject> & {
segName: string
isSegNameEditable: boolean
value?: number
initialVariableName: string
}
export const createInfoModal = create<
GetInfoModalProps,
ModalResolve,
ModalReject
>
export const GetInfoModal = ({
isOpen,
onResolve,
@ -17,25 +42,12 @@ export const GetInfoModal = ({
isSegNameEditable,
value: initialValue,
initialVariableName,
}: {
isOpen: boolean
onResolve: (a: {
value: string
segName: string
valueNode: Value
variableName?: string
newVariableInsertIndex: number
sign: number
}) => void
onReject: (a: any) => void
segName: string
isSegNameEditable: boolean
value: number
initialVariableName: string
}) => {
}: GetInfoModalProps) => {
const [sign, setSign] = useState(Math.sign(Number(initialValue)))
const [segName, setSegName] = useState(initialSegName)
const [value, setValue] = useState(String(Math.abs(initialValue)))
const [value, setValue] = useState(
initialValue === undefined ? '' : String(Math.abs(initialValue))
)
const [shouldCreateVariable, setShouldCreateVariable] = useState(false)
const {

21
src/components/SetVarNameModal.tsx
View File

@ -4,19 +4,26 @@ import { useCalc, CreateNewVariable } from './AvailableVarsHelpers'
import { ActionButton } from './ActionButton'
import { faPlus } from '@fortawesome/free-solid-svg-icons'
import { toast } from 'react-hot-toast'
import { type InstanceProps, create } from 'react-modal-promise'
type ModalResolve = { variableName: string }
type ModalReject = boolean
type SetVarNameModalProps = InstanceProps<ModalResolve, ModalReject> & {
valueName: string
}
export const createSetVarNameModal = create<
SetVarNameModalProps,
ModalResolve,
ModalReject
>
export const SetVarNameModal = ({
isOpen,
onResolve,
onReject,
valueName,
}: {
isOpen: boolean
onResolve: (a: { variableName?: string }) => void
onReject: (a: any) => void
value: number
valueName: string
}) => {
}: SetVarNameModalProps) => {
const { isNewVariableNameUnique, newVariableName, setNewVariableName } =
useCalc({ value: '', initialVariableName: valueName })

22
src/components/Toolbar/Intersect.tsx
View File

@ -1,5 +1,4 @@
import { useState, useEffect } from 'react'
import { create } from 'react-modal-promise'
import { toolTips, useStore } from '../../useStore'
import { BinaryPart, Value, VariableDeclarator } from '../../lang/wasm'
import {
@ -13,12 +12,12 @@ import {
transformSecondarySketchLinesTagFirst,
getTransformInfos,
} from '../../lang/std/sketchcombos'
import { GetInfoModal } from '../SetHorVertDistanceModal'
import { GetInfoModal, createInfoModal } from '../SetHorVertDistanceModal'
import { createVariableDeclaration } from '../../lang/modifyAst'
import { removeDoubleNegatives } from '../AvailableVarsHelpers'
import { updateCursors } from '../../lang/util'
const getModalInfo = create(GetInfoModal as any)
const getModalInfo = createInfoModal(GetInfoModal)
export const Intersect = () => {
const { guiMode, selectionRanges, ast, programMemory, updateAst, setCursor } =
@ -136,20 +135,19 @@ export const Intersect = () => {
variableName,
newVariableInsertIndex,
sign,
}: {
segName: string
value: number
valueNode: Value
variableName?: string
newVariableInsertIndex: number
sign: number
} = await getModalInfo({
segName: tagInfo?.tag,
isSegNameEditable: !tagInfo?.isTagExisting,
value: valueUsedInTransform,
initialVariableName: 'offset',
} as any)
if (segName === tagInfo?.tag && value === valueUsedInTransform) {
})
if (
segName === tagInfo?.tag &&
value ===
(valueUsedInTransform === undefined
? ''
: String(Math.abs(valueUsedInTransform)))
) {
updateAst(modifiedAst, true, {
callBack: updateCursors(setCursor, selectionRanges, pathToNodeMap),
})

93
src/components/Toolbar/SetAbsDistance.tsx
View File

@ -1,7 +1,6 @@
import { useState, useEffect } from 'react'
import { create } from 'react-modal-promise'
import { toolTips, useStore } from '../../useStore'
import { Value } from '../../lang/wasm'
import { BinaryPart, Identifier, Value } from '../../lang/wasm'
import {
getNodePathFromSourceRange,
getNodeFromPath,
@ -12,7 +11,10 @@ import {
transformAstSketchLines,
ConstraintType,
} from '../../lang/std/sketchcombos'
import { SetAngleLengthModal } from '../SetAngleLengthModal'
import {
SetAngleLengthModal,
createSetAngleLengthModal,
} from '../SetAngleLengthModal'
import {
createIdentifier,
createVariableDeclaration,
@ -20,7 +22,7 @@ import {
import { removeDoubleNegatives } from '../AvailableVarsHelpers'
import { updateCursors } from '../../lang/util'
const getModalInfo = create(SetAngleLengthModal as any)
const getModalInfo = createSetAngleLengthModal(SetAngleLengthModal)
type ButtonType = 'xAbs' | 'yAbs' | 'snapToYAxis' | 'snapToXAxis'
@ -98,40 +100,67 @@ export const SetAbsDistance = ({ buttonType }: { buttonType: ButtonType }) => {
programMemory,
referenceSegName: '',
})
function transformValue(
fv: Identifier | BinaryPart,
transformInfos: TransformInfo[]
) {
return transformAstSketchLines({
ast: JSON.parse(JSON.stringify(ast)),
selectionRanges: selectionRanges,
transformInfos,
programMemory,
referenceSegName: '',
forceValueUsedInTransform: fv,
})
}
try {
let forceVal = valueUsedInTransform || 0
const { valueNode, variableName, newVariableInsertIndex, sign } =
await (!isAlign &&
getModalInfo({
if (!isAlign) {
const forceVal = valueUsedInTransform || 0
const { valueNode, variableName, newVariableInsertIndex, sign } =
await getModalInfo({
value: forceVal,
valueName: disType === 'yAbs' ? 'yDis' : 'xDis',
} as any))
let finalValue = isAlign
? createIdentifier('_0')
: removeDoubleNegatives(valueNode, sign, variableName)
})
const { modifiedAst: _modifiedAst, pathToNodeMap } =
transformAstSketchLines({
ast: JSON.parse(JSON.stringify(ast)),
selectionRanges: selectionRanges,
transformInfos,
programMemory,
referenceSegName: '',
forceValueUsedInTransform: finalValue,
})
if (variableName) {
const newBody = [..._modifiedAst.body]
newBody.splice(
newVariableInsertIndex,
0,
createVariableDeclaration(variableName, valueNode)
const finalValue = removeDoubleNegatives(
valueNode as BinaryPart,
sign,
variableName
)
_modifiedAst.body = newBody
}
const { modifiedAst: _modifiedAst, pathToNodeMap: _pathToNodeMap } =
transformValue(finalValue, transformInfos)
updateAst(_modifiedAst, true, {
callBack: updateCursors(setCursor, selectionRanges, pathToNodeMap),
})
if (variableName) {
const newBody = [..._modifiedAst.body]
newBody.splice(
newVariableInsertIndex,
0,
createVariableDeclaration(variableName, valueNode)
)
_modifiedAst.body = newBody
}
updateAst(_modifiedAst, true, {
callBack: updateCursors(
setCursor,
selectionRanges,
_pathToNodeMap
),
})
} else {
const { modifiedAst: _modifiedAst, pathToNodeMap: _pathToNodeMap } =
transformValue(createIdentifier('_0'), transformInfos)
updateAst(_modifiedAst, true, {
callBack: updateCursors(
setCursor,
selectionRanges,
_pathToNodeMap
),
})
}
} catch (e) {
console.log('error', e)
}

22
src/components/Toolbar/SetAngleBetween.tsx
View File

@ -1,5 +1,4 @@
import { useState, useEffect } from 'react'
import { create } from 'react-modal-promise'
import { toolTips, useStore } from '../../useStore'
import { BinaryPart, Value, VariableDeclarator } from '../../lang/wasm'
import {
@ -12,12 +11,12 @@ import {
transformSecondarySketchLinesTagFirst,
getTransformInfos,
} from '../../lang/std/sketchcombos'
import { GetInfoModal } from '../SetHorVertDistanceModal'
import { GetInfoModal, createInfoModal } from '../SetHorVertDistanceModal'
import { createVariableDeclaration } from '../../lang/modifyAst'
import { removeDoubleNegatives } from '../AvailableVarsHelpers'
import { updateCursors } from '../../lang/util'
const getModalInfo = create(GetInfoModal as any)
const getModalInfo = createInfoModal(GetInfoModal)
export const SetAngleBetween = () => {
const { guiMode, selectionRanges, ast, programMemory, updateAst, setCursor } =
@ -95,20 +94,19 @@ export const SetAngleBetween = () => {
variableName,
newVariableInsertIndex,
sign,
}: {
segName: string
value: number
valueNode: Value
variableName?: string
newVariableInsertIndex: number
sign: number
} = await getModalInfo({
segName: tagInfo?.tag,
isSegNameEditable: !tagInfo?.isTagExisting,
value: valueUsedInTransform,
initialVariableName: 'angle',
} as any)
if (segName === tagInfo?.tag && value === valueUsedInTransform) {
})
if (
segName === tagInfo?.tag &&
value ===
(valueUsedInTransform === undefined
? ''
: String(Math.abs(valueUsedInTransform)))
) {
updateAst(modifiedAst, true, {
callBack: updateCursors(setCursor, selectionRanges, pathToNodeMap),
})

84
src/components/Toolbar/SetHorzVertDistance.tsx
View File

@ -1,5 +1,4 @@
import { useState, useEffect } from 'react'
import { create } from 'react-modal-promise'
import { toolTips, useStore } from '../../useStore'
import { BinaryPart, Value, VariableDeclarator } from '../../lang/wasm'
import {
@ -13,12 +12,12 @@ import {
getTransformInfos,
ConstraintType,
} from '../../lang/std/sketchcombos'
import { GetInfoModal } from '../SetHorVertDistanceModal'
import { GetInfoModal, createInfoModal } from '../SetHorVertDistanceModal'
import { createLiteral, createVariableDeclaration } from '../../lang/modifyAst'
import { removeDoubleNegatives } from '../AvailableVarsHelpers'
import { updateCursors } from '../../lang/util'
const getModalInfo = create(GetInfoModal as any)
const getModalInfo = createInfoModal(GetInfoModal)
type ButtonType =
| 'setHorzDistance'
@ -119,38 +118,46 @@ export const SetHorzVertDistance = ({
transformInfos,
programMemory,
})
const {
segName,
value,
valueNode,
variableName,
newVariableInsertIndex,
sign,
}: {
segName: string
value: number
valueNode: Value
variableName?: string
newVariableInsertIndex: number
sign: number
} = await (!isAlign &&
getModalInfo({
if (!isAlign) {
const {
segName,
value,
valueNode,
variableName,
newVariableInsertIndex,
sign,
} = await getModalInfo({
segName: tagInfo?.tag,
isSegNameEditable: !tagInfo?.isTagExisting,
value: valueUsedInTransform,
initialVariableName:
constraint === 'setHorzDistance' ? 'xDis' : 'yDis',
} as any))
if (segName === tagInfo?.tag && value === valueUsedInTransform) {
updateAst(modifiedAst, true, {
callBack: updateCursors(setCursor, selectionRanges, pathToNodeMap),
})
} else {
let finalValue = isAlign
? createLiteral(0)
: removeDoubleNegatives(valueNode as BinaryPart, sign, variableName)
// transform again but forcing certain values
const { modifiedAst: _modifiedAst, pathToNodeMap } =
if (
segName === tagInfo?.tag &&
value ===
(valueUsedInTransform === undefined
? ''
: String(Math.abs(valueUsedInTransform)))
) {
updateAst(modifiedAst, true, {
callBack: updateCursors(
setCursor,
selectionRanges,
pathToNodeMap
),
})
}
const finalValue = removeDoubleNegatives(
valueNode as BinaryPart,
sign,
variableName
)
const { modifiedAst: _modifiedAst, pathToNodeMap: _pathToNodeMap } =
transformSecondarySketchLinesTagFirst({
ast,
selectionRanges,
@ -159,6 +166,7 @@ export const SetHorzVertDistance = ({
forceSegName: segName,
forceValueUsedInTransform: finalValue,
})
if (variableName) {
const newBody = [..._modifiedAst.body]
newBody.splice(
@ -168,8 +176,24 @@ export const SetHorzVertDistance = ({
)
_modifiedAst.body = newBody
}
updateAst(_modifiedAst, true, {
callBack: updateCursors(setCursor, selectionRanges, pathToNodeMap),
callBack: updateCursors(setCursor, selectionRanges, _pathToNodeMap),
})
} else {
const finalValue = createLiteral(0)
const { modifiedAst: _modifiedAst, pathToNodeMap: _pathToNodeMap } =
transformSecondarySketchLinesTagFirst({
ast,
selectionRanges,
transformInfos,
programMemory,
forceValueUsedInTransform: finalValue,
})
updateAst(_modifiedAst, true, {
callBack: updateCursors(setCursor, selectionRanges, _pathToNodeMap),
})
}
}}

4
src/components/Toolbar/setAngleLength.tsx
View File

@ -21,7 +21,7 @@ import { removeDoubleNegatives } from '../AvailableVarsHelpers'
import { normaliseAngle } from '../../lib/utils'
import { updateCursors } from '../../lang/util'
const getModalInfo = create(SetAngleLengthModal as any)
const getModalInfo = create(SetAngleLengthModal)
type ButtonType = 'setAngle' | 'setLength'
@ -112,7 +112,7 @@ export const SetAngleLength = ({
value: forceVal,
valueName: angleOrLength === 'setAngle' ? 'angle' : 'length',
shouldCreateVariable: true,
} as any)
})
let finalValue = removeDoubleNegatives(valueNode, sign, variableName)
if (
isReferencingYAxisAngle ||

10
src/hooks/useToolbarGuards.ts
View File

@ -1,11 +1,13 @@
import { SetVarNameModal } from 'components/SetVarNameModal'
import {
SetVarNameModal,
createSetVarNameModal,
} from 'components/SetVarNameModal'
import { moveValueIntoNewVariable } from 'lang/modifyAst'
import { isNodeSafeToReplace } from 'lang/queryAst'
import { useEffect, useState } from 'react'
import { create } from 'react-modal-promise'
import { useStore } from 'useStore'
const getModalInfo = create(SetVarNameModal as any)
const getModalInfo = createSetVarNameModal(SetVarNameModal)
export function useConvertToVariable() {
const { guiMode, selectionRanges, ast, programMemory, updateAst } = useStore(
@ -37,7 +39,7 @@ export function useConvertToVariable() {
try {
const { variableName } = await getModalInfo({
valueName: 'var',
} as any)
})
const { modifiedAst: _modifiedAst } = moveValueIntoNewVariable(
ast,