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.

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

Make generator es6 and ts usable at same time #1299

Merged
merged 1 commit into from
Aug 25, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -9,6 +9,9 @@ Changes since the last non-beta release.

_Please add entries here for your pull requests that are not yet released._

#### Changed
- Make es6 and ts usable at same time. #1299

## [3.1.1] - 2023-08-16

#### Removed
8 changes: 7 additions & 1 deletion lib/generators/react/component_generator.rb
Original file line number Diff line number Diff line change
@@ -256,14 +256,20 @@ def lookup(type = "node", options = "")
def detect_template_extension
if options[:coffee]
"js.jsx.coffee"
elsif options[:ts] && es6_enabled?
"es6.tsx"
elsif options[:ts]
"js.jsx.tsx"
elsif options[:es6] || shakapacker?
elsif es6_enabled?
"es6.jsx"
else
"js.jsx"
end
end

def es6_enabled?
options[:es6] || shakapacker?
end
end
end
end
24 changes: 24 additions & 0 deletions lib/generators/templates/component.es6.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<%= file_header %>
interface I<%= component_name %>Props {
<% if attributes.size > 0 -%>
<% attributes.each do |attribute| -%>
<% if attribute[:union] -%>
<%= attribute[:name].camelize(:lower) %>: <%= attribute[:name].titleize %>;
<% else -%>
<%= attribute[:name].camelize(:lower) %>: <%= attribute[:type] %>;
<% end -%>
<% end -%>
<% end -%>
}

const <%= component_name %> = (props: I<%= component_name %>Props) => {
return (
<React.Fragment>
<% attributes.each do |attribute| -%>
<%= attribute[:name].titleize %>: {props.<%= attribute[:name].camelize(:lower) %>}
<% end -%>
</React.Fragment>
)
}

<%= file_footer %>
36 changes: 36 additions & 0 deletions test/generators/ts_es6_component_generator_test.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
# frozen_string_literal: true

require "test_helper"
require "generators/react/component_generator"

class TsEs6ComponentGeneratorTest < Rails::Generators::TestCase
destination File.join(Rails.root, "tmp", "component_generator_test_output")
setup :prepare_destination
tests React::Generators::ComponentGenerator

if ShakapackerHelpers.available?
def filename
"app/javascript/components/GeneratedComponent.tsx"
end
else
def filename
"app/assets/javascripts/components/generated_component.es6.tsx"
end
end

def component_name
"GeneratedComponent"
end

test "uses ts and es6 syntax" do
run_generator %w[GeneratedComponent name:string --ts --es6]

assert_file filename, /const #{component_name} = \(props: I#{component_name}Props\) => {/
end

test "defines props type" do
run_generator %w[GeneratedComponent name:string --ts --es6]

assert_file filename, /name: string;/
end
end