Skip to content

Add Path and CSS Generation Configuration to React Component Genration #1

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.

Sign up for GitHub

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

Open
BibekBhusal0 wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Add Path and CSS Generation Configuration to React Component Genration #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
31b53b5
Add css file generation and default_path in config options
BibekBhusal0 Mar 24, 2025
ceedf26
Update react-component-generator.lua: typo fix
BibekBhusal0 Sep 11, 2025
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
2 changes: 2 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,8 @@ Add this to your `init.lua or plugins.lua`
require("react-component-generator").setup({
templates_dir = "~/custom-templates-directory", -- Custom templates directory (Optional)
file_extension = "tsx", -- Preferred file extension (Optional)
generate_css_file = true, -- Weather or not to generate css file (Optional) default true
default_path = '/src/app/components/', -- Default path where component will be created this is relative to current directory (optional)
})
end,
}
Expand Down
38 changes: 22 additions & 16 deletions lua/react-component-generator.lua
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,12 @@
local utils = require("react-component-generator.utils")

-- Define the default template directory
local default_template_dir = utils.get_plugin_dir() .. "/templates/"
local default_file_extension = "tsx"
-- Define the default Config
local default_config = {
file_extension = "tsx",
default_path = "/src/app/components/",
template_dir = utils.get_plugin_dir() .. "/templates/",
generate_css_file = true,
}

-- Generate React component
local function GenerateComponent(component_name, template_dir, config)
Expand All @@ -23,24 +27,24 @@ local function GenerateComponent(component_name, template_dir, config)
local current_dir = vim.fn.getcwd()

-- Set the directory path
local dir_path = current_dir .. "/src/app/components/" .. pascal_case_name
local dir_path = current_dir .. config.defult_path .. pascal_case_name

-- Create the component directory
if not utils.create_directory(dir_path) then
return
end

-- Determine the file extension
file_extension = file_extension ~= "" and file_extension or config.file_extension or default_file_extension
file_extension = file_extension ~= "" and file_extension or config.file_extension or default_config.file_extension

-- Read the index template from the specified template directory
local template_file = "index_" .. file_extension .. "_template." .. file_extension
local index_template_path = template_dir .. "/" .. template_file
local index_template = utils.read_file(index_template_path)

-- If the template content is nil, attempt to read from the default template directory
if not index_template and template_dir ~= default_template_dir then
index_template_path = default_template_dir .. "/" .. template_file
if not index_template and template_dir ~= default_config.template_dir then
index_template_path = default_config.template_dir .. "/" .. template_file
index_template = utils.read_file(index_template_path)
end

Expand All @@ -58,22 +62,24 @@ local function GenerateComponent(component_name, template_dir, config)
return
end

-- Create the styles file
local styles_file = dir_path .. "/styles.css"
local styles_content = "." .. pascal_case_name .. [[ {
if config.generate_css_file then
-- Create the styles file
local styles_file = dir_path .. "/styles.css"
local styles_content = "." .. pascal_case_name .. [[ {
/* Add your styles here */
}
]]
if not utils.write_file(styles_file, styles_content) then
return
if not utils.write_file(styles_file, styles_content) then
return
end
end

-- Print success message
print("Component " .. pascal_case_name .. " created successfully in " .. dir_path)
end

local function setup(config)
config = config or {}
config = vim.tbl_extend("force", default_config, config)

-- Ensure the command is created only once
if vim.g.react_component_generator_commands_created then
Expand All @@ -83,11 +89,11 @@ local function setup(config)
-- Create the user command for generating components
vim.api.nvim_create_user_command("CreateComponent", function(opts)
-- Set template directory
local templates_dir = config.templates_dir and vim.fn.expand(config.templates_dir) or default_template_dir
local file_extension = config.file_extension or default_file_extension
local templates_dir = config.templates_dir and vim.fn.expand(config.templates_dir)
or default_config.template_dir

-- Call the GenerateComponent function
GenerateComponent(opts.args, templates_dir, { file_extension = file_extension })
GenerateComponent(opts.args, templates_dir, config)

-- Check if NeoTree is installed and refresh if it is
if pcall(require, "neo-tree.sources.filesystem.commands") then
Expand Down