Need to share some common JS code between clientside fbt.js and Babel transform node modules

[kayhadrin]

🚀 Feature Proposal

Currently, we have some JS constants that are defined twice on the clientside and Babel transform modules.

E.g. The Gender constant object that defines all the supported types of genders is defined in two places that need to be kept up to date manually.

• fbt/runtime/nonfb/GenderConst.js

  Lines 16 to 32 in a61a13b

  	const GenderConst = Object.freeze({
  	/* eslint-disable fb-www/no-flowfixme-in-flow-strict */
  	NOT_A_PERSON: ((0: $FlowFixMe): GenderConstEnum),
  	FEMALE_SINGULAR: ((1: $FlowFixMe): GenderConstEnum),
  	MALE_SINGULAR: ((2: $FlowFixMe): GenderConstEnum),
  	FEMALE_SINGULAR_GUESS: ((3: $FlowFixMe): GenderConstEnum),
  	MALE_SINGULAR_GUESS: ((4: $FlowFixMe): GenderConstEnum),
  	MIXED_SINGULAR: ((5: $FlowFixMe): GenderConstEnum),
  	MIXED_PLURAL: ((5: $FlowFixMe): GenderConstEnum),
  	NEUTER_SINGULAR: ((6: $FlowFixMe): GenderConstEnum),
  	UNKNOWN_SINGULAR: ((7: $FlowFixMe): GenderConstEnum),
  	FEMALE_PLURAL: ((8: $FlowFixMe): GenderConstEnum),
  	MALE_PLURAL: ((9: $FlowFixMe): GenderConstEnum),
  	NEUTER_PLURAL: ((10: $FlowFixMe): GenderConstEnum),
  	UNKNOWN_PLURAL: ((11: $FlowFixMe): GenderConstEnum),
  	/* eslint-enable fb-www/no-flowfixme-in-flow-strict */
  	});

• fbt/packages/babel-plugin-fbt/Gender.js

  Lines 12 to 29 in a61a13b

  	const GENDER_CONST = {
  	NOT_A_PERSON: 0,
  	FEMALE_SINGULAR: 1,
  	MALE_SINGULAR: 2,
  	FEMALE_SINGULAR_GUESS: 3,
  	MALE_SINGULAR_GUESS: 4,
  	// 5 seems to indicate a group of people who may be of mixed gender
  	MIXED_SINGULAR: 5,
  	MIXED_PLURAL: 5,
  	NEUTER_SINGULAR: 6,
  	UNKNOWN_SINGULAR: 7,
  	FEMALE_PLURAL: 8,
  	MALE_PLURAL: 9,
  	NEUTER_PLURAL: 10,
  	UNKNOWN_PLURAL: 11,
  	};

Motivation

Going forward, it'd make sense to avoid having to write duplicate JS constants.
Some JS functions might even be shared in the future.

How to do it?

We should figure out a way to share some common constants between the node.js and client-side modules.
Maybe by having the fbt npm module become a peerDependency of babel-plugin-fbt?

Or by defining the shared JS code into a special folder that'd be accessible to both babel-plugin-fbt and fbt in Flow checks, and also bundled in these respective npm modules using some Gulp magic?