Reputation: 470
Hi I have this piece of code and I want to convert from flow to typescript. My progress so far is to convert the type to interface but I am stuck here
// @flow
export type AlertType = 'success'
export type AlertProps = {
type: AlertType,
text: string,
testId: string,
}
type AlertTypeIconMap = {
+[AlertType]: IconType,
}
const Alert = ({ type, text, testId }: AlertProps) => {
const alertTypeIconMap: AlertTypeIconMap = {
success: 'tick',
}
const styles = getStyles({ type })
return (
<View style={styles.iconContainer}>
<Icon type={alertTypeIconMap[type]} />
</View>
)
}
export default Alert
my progress so far is
export type AlertType = 'success'
export interface AlertProps {
type: AlertType
text: string
testId: string
}
interface AlertTypeIconMap {
+[AlertType]: IconType
}
I am getting an error at this line
interface AlertTypeIconMap {
+[AlertType]: IconType
}
saying 'AlertType' only refers to a type, but is being used as a value here
Upvotes: 1
Views: 685
Reputation: 3437
I used flow-to-ts
yarn global add @khanacademy/flow-to-ts
flow-to-ts --write --delete-source ${myProjectPath}/src/**/**.js
There are other options:
Usage: flow-to-ts [options]
Options:
-V, --version output the version number
--inline-utility-types inline utility types when possible, defaults to 'false'
--prettier use prettier for formatting
--semi add semi-colons, defaults to 'false' (depends on --prettier)
--single-quote use single quotes instead of double quotes, defaults to 'false' (depends on --prettier)
--tab-width [width] size of tabs (depends on --prettier) (default: 4)
--trailing-comma [all|es5|none] where to put trailing commas (depends on --prettier) (default: "all")
--bracket-spacing put spaces between braces and contents, defaults to 'false' (depends on --prettier)
--arrow-parens [avoid|always] arrow function param list parens (depends on --prettier) (default: "avoid")
--print-width [width] line width (depends on --prettier) (default: 80)
--write write output to disk instead of STDOUT
--delete-source delete the source file
-h, --help output usage information
Upvotes: 0
Reputation: 754
TypeScript syntax is something like this [k in AlertType]
,
// assume IconType
type IconType = '';
export type AlertType = 'success';
export type AlertTypeIconMap = { [k in AlertType]: IconType };
Upvotes: 1