Hi all. I am
Thiago Borba
> Front-end developer
// find my profile on Github:
const githubLink = "https://github.com/thiagoborba/"
// thiagoborba/portifolio-front — index.tsx
const ButtonRender = (
{ variant = 'primary', className, children, ...props }: ButtonProps,
ref: Ref<HTMLButtonElement>,
) => {
return (
<button
{...props}
ref={ref}
className={cn(styles.button, className, {
[styles['-primary']]: variant === 'primary',
[styles['-secondary']]: variant === 'secondary',
})}
>
{children}
</button>
);
};// thiagoborba/portifolio-back — github.ts
export async function fetchSnippets(): Promise<Snippet[]> {
const octokit = new Octokit({ auth: process.env.GITHUB_TOKEN });
const results = await Promise.allSettled(
REPOS.map(({ owner, repo }) => fetchSnippetForRepo(octokit, owner, repo)),
);
return results
.filter(
(result): result is PromiseFulfilledResult<Snippet> =>
result.status === 'fulfilled' && result.value !== null,
)
.map((result) => result.value);
}// thiagoborba/briefing2task-front — index.tsx
function ActionCard({ title, description, copied, onClick, disabled }: ActionCardProps) {
return (
<button
className={`${styles.card}${copied ? ` ${styles.cardCopied}` : ''}`}
onClick={onClick}
disabled={disabled}
>
<span className={styles.actionTitle}>{title}</span>
<span className={styles.actionDesc}>{description}</span>
<span className={styles.copyLabel} aria-live="polite">
{copied ? '✓ Copiado!' : 'Clique para copiar'}
</span>
</button>
);
}// thiagoborba/design-system — index.tsx
export const Paragraph: React.FunctionComponent<Props> = ({
weight = 'regular',
color = 'darkHigh',
className,
children,
...props
}) => (
<p
className={cn(styles['paragraph'], className, {
[styles[`-${weight}`]]: !!weight,
[styles['-darkLow']]: color === 'darkLow',
[styles['-darkMedium']]: color === 'darkMedium',
[styles['-darkHigh']]: color === 'darkHigh',
[styles['-lightSolid']]: color === 'lightSolid',
[styles['-lightHigh']]: color === 'lightHigh',
})}
{...props}
>
{children}
</p>
);// thiagoborba/frontend-challenge — index.ts
function getStarWarsData<t>(url: string) {
let requestResponse: t[] = []
return request(url)
.then(response => {
requestResponse = response.data.results;
return response.data.count;
})
.then(count => {
const numberOfPagesLeft = Math.ceil((count - 1) / 10);
let promises = [];
for (let i = 2; i <= numberOfPagesLeft; i++) {
promises.push(request(`${url}?page=${i}`));
}
return Promise.all(promises);
})
.then(response => {
requestResponse = response.reduce((acc, data) => [...acc, ...data.data.results], requestResponse);
return requestResponse;
})
.catch(error => console.log(error));
}// thiagoborba/chartOfAccounts — index.tsx
function HeaderContainer({ children, ...props }: InterfaceVStackProps) {
return (
<VStack backgroundColor={"UCondo.dark"} padding={4} {...props}>
<StatusBar barStyle="light-content" />
<Box safeAreaTop />
{children}
</VStack>
);
}// thiagoborba/portifolio-front — index.tsx
const ButtonRender = (
{ variant = 'primary', className, children, ...props }: ButtonProps,
ref: Ref<HTMLButtonElement>,
) => {
return (
<button
{...props}
ref={ref}
className={cn(styles.button, className, {
[styles['-primary']]: variant === 'primary',
[styles['-secondary']]: variant === 'secondary',
})}
>
{children}
</button>
);
};// thiagoborba/portifolio-back — github.ts
export async function fetchSnippets(): Promise<Snippet[]> {
const octokit = new Octokit({ auth: process.env.GITHUB_TOKEN });
const results = await Promise.allSettled(
REPOS.map(({ owner, repo }) => fetchSnippetForRepo(octokit, owner, repo)),
);
return results
.filter(
(result): result is PromiseFulfilledResult<Snippet> =>
result.status === 'fulfilled' && result.value !== null,
)
.map((result) => result.value);
}// thiagoborba/briefing2task-front — index.tsx
function ActionCard({ title, description, copied, onClick, disabled }: ActionCardProps) {
return (
<button
className={`${styles.card}${copied ? ` ${styles.cardCopied}` : ''}`}
onClick={onClick}
disabled={disabled}
>
<span className={styles.actionTitle}>{title}</span>
<span className={styles.actionDesc}>{description}</span>
<span className={styles.copyLabel} aria-live="polite">
{copied ? '✓ Copiado!' : 'Clique para copiar'}
</span>
</button>
);
}// thiagoborba/design-system — index.tsx
export const Paragraph: React.FunctionComponent<Props> = ({
weight = 'regular',
color = 'darkHigh',
className,
children,
...props
}) => (
<p
className={cn(styles['paragraph'], className, {
[styles[`-${weight}`]]: !!weight,
[styles['-darkLow']]: color === 'darkLow',
[styles['-darkMedium']]: color === 'darkMedium',
[styles['-darkHigh']]: color === 'darkHigh',
[styles['-lightSolid']]: color === 'lightSolid',
[styles['-lightHigh']]: color === 'lightHigh',
})}
{...props}
>
{children}
</p>
);// thiagoborba/frontend-challenge — index.ts
function getStarWarsData<t>(url: string) {
let requestResponse: t[] = []
return request(url)
.then(response => {
requestResponse = response.data.results;
return response.data.count;
})
.then(count => {
const numberOfPagesLeft = Math.ceil((count - 1) / 10);
let promises = [];
for (let i = 2; i <= numberOfPagesLeft; i++) {
promises.push(request(`${url}?page=${i}`));
}
return Promise.all(promises);
})
.then(response => {
requestResponse = response.reduce((acc, data) => [...acc, ...data.data.results], requestResponse);
return requestResponse;
})
.catch(error => console.log(error));
}// thiagoborba/chartOfAccounts — index.tsx
function HeaderContainer({ children, ...props }: InterfaceVStackProps) {
return (
<VStack backgroundColor={"UCondo.dark"} padding={4} {...props}>
<StatusBar barStyle="light-content" />
<Box safeAreaTop />
{children}
</VStack>
);
}