[prettierx] verbose ternary formatting

[brodybits]

From issues such as issue #41 and prettier/prettier#5814, I am starting to wonder if we should consider a better way to format ternary expressions.

As described in prettier/prettier#5814 (comment) & prettier/prettier#5814 (comment), my idea would be to format JavaScript & TypeScript ternaries just like Prettier formats ternaries in JSX:

const result = type === 'first' ? (
  getFirstThing()
) : type === 'second' ? (
  getSecondThing()
) : (
  getOtherThing()
)

I tried the following update and it seems to do what we want here:

--- a/src/language-js/printer-estree.js
+++ b/src/language-js/printer-estree.js
@@ -370,6 +370,7 @@ function printTernaryOperator(path, options, print, operatorOptions) {
   const lastConditionalParent = previousParent;
 
   if (
+    true || // [prettierx option goes here instead of `true`]
     operatorOptions.shouldCheckJsx &&
     (isJSXNode(testNode) ||
       isJSXNode(consequentNode) ||

/cc @aMarCruz @sheerun

[brodybits]

I just tried the following JavaScript on standard with no issues:

const a1 = process.env.a ? (
  1 + 2 * 3
) : (
  4 * 5 + 6
)

console.log(`a1 value: ${a1}`)

[sheerun]

I'm for as much similarity to prettier as possible, unless standard has conflicting rule for something

prettier format above as:

const a1 = process.env.a ? 1 + 2 * 3 : 4 * 5 + 6;

console.log(`a1 value: ${a1}`);

and for longer ternaries:

const a1 = process.env.a
  ? 123412341234 + 34523452345234523 * 34123412341234
  : 34123412341234 * 34123412341234 +
    34123412341234;

console.log(`a1 value: ${a1}`);

but for JSX it outputs:

const StorybookLoader = ({ match }) =>
  match.params.storyId === "button" ? (
    <ButtonStorybook />
  ) : match.params.storyId === "color" ? (
    <ColorBook />
  ) : match.params.storyId === "typography" ? (
    <TypographyBook />
  ) : match.params.storyId === "loading" ? (
    <LoaderStorybook />
  ) : match.params.storyId === "deal-list" ? (
    <DealListStory />
  ) : (
    <Message>
      <Title>{"Missing story book"}</Title>
      <Content>
        <BackButton />
      </Content>
    </Message>
  );