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

feat: support branding #639

Open
wants to merge 6 commits into
base: next
Choose a base branch
from

Conversation

tlow92
Copy link
Contributor

@tlow92 tlow92 commented Nov 2, 2024

Implements Feature:

#625

What I did

Support for branding, based on the patches from @trajano. Many thanks!

How it works

export interface Brand {
  // Will replace the storybook logo with this title
  title: string | undefined;
  // This url we be opened when clicking the branded logo or title
  url: string | null | undefined;
  // Either define a url or an image source to replace storybook logo with
  image: string | ImageSourcePropType | null | undefined;
  target: string | null | undefined;
}

@tlow92 tlow92 requested a review from dannyhw as a code owner November 2, 2024 19:25
@tlow92 tlow92 changed the title Feat-support-branding feat: support branding Nov 2, 2024
decorators: [
(Story) => {
const theme = useTheme();
return <Story args={{ theme: { ...theme, brand: { title: 'React Native' } } }} />;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't like having this decorator in every story just to make typescript happy. Essentially the problem is only that theme requires a lot of properties that we don't want to define here.
Maybe I missed something to make it easier?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://github.com/trajano/expo-experiments/blob/4287571d3a9fe568700ce97ecc266d5a5bff621e/packages/my-app/.storybook/index.ts#L11-L16 shows what I did on mine to pass it in, but I cheated with the any because of the imageSource thing which you resolved in web-theme.ts I think.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But I think what you have looks correct. At least for the context of the story.

Copy link
Contributor

@trajano trajano left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't wait to drop my patches :D

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think just use the existing Storybook logo to prevent having another asset,

decorators: [
(Story) => {
const theme = useTheme();
return <Story args={{ theme: { ...theme, brand: { title: 'React Native' } } }} />;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://github.com/trajano/expo-experiments/blob/4287571d3a9fe568700ce97ecc266d5a5bff621e/packages/my-app/.storybook/index.ts#L11-L16 shows what I did on mine to pass it in, but I cheated with the any because of the imageSource thing which you resolved in web-theme.ts I think.

decorators: [
(Story) => {
const theme = useTheme();
return <Story args={{ theme: { ...theme, brand: { title: 'React Native' } } }} />;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But I think what you have looks correct. At least for the context of the story.

@dannyhw
Copy link
Member

dannyhw commented Nov 3, 2024

Thanks so much for taking the time, I promise I will get to this pr soon. I have a lot going on currently but ideally in this coming week. Feel free to tag me as a reminder if I take too long :).

@trajano
Copy link
Contributor

trajano commented Nov 9, 2024

I updated by patches but should still be the same

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants