Files
freeCodeCamp/tools/ui-components/utils/gen-component-template.ts

60 lines
1.3 KiB
TypeScript
Raw Permalink Normal View History

// component.tsx
export const component = (name: string) => `
import React from 'react';
import { ${name}Props } from './types';
export const ${name} = ({}: ${name}Props) => {
return <div>Hello, I am a ${name} component</div>;
};
`;
// types.ts
export const type = (name: string) => `
export interface ${name}Props {
className?: string
}
`;
// component.test.tsx
export const test = (name: string) => `
import React from 'react';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { ${name} } from '.';
describe('<${name} />', () => {
it('should render correctly', () => {});
});
`;
// component.stories.tsx
export const story = (name: string) => `
import React from 'react';
import { Story } from '@storybook/react';
import { ${name}, ${name}Props } from '.';
const story = {
title: 'Example/${name}',
component: ${name}
};
const Template: Story<${name}Props> = args => {
return <${name} {...args} />;
};
export const Default = Template.bind({});
Default.args = {
// default props go here
};
export default story;
`;
// index.ts
export const barrel = (name: string, kebabCasedName: string) => `
export { ${name} } from './${kebabCasedName}';
export type { ${name}Props } from './types';
`;