@hhgtech/hhg-components 1.19.0-beta-7 → 1.19.0-beta-8

package/src/components/organisms/navigationLayout/index.stories.tsx

@@ -1,273 +0,0 @@
-import React from 'react'
-
-import { Story } from '@storybook/react/types-6-0'
-
-import { CloseWhiteIcon } from './assets'
-import { Props } from './index'
-import { NavigationLayout } from './languageWrapper'
-import { SiteWide } from './siteWide'
-import { StickySponsoredBy } from './sponsoredBy'
-
-export default {
-  component: NavigationLayout,
-  title: 'Organisms/NavigationLayout',
-}
-
-const Template: Story<Props> = (args) => (
-  <NavigationLayout {...args}>
-    <></>
-  </NavigationLayout>
-)
-
-export const DesktopMarryBaby = Template.bind({})
-export const DesktopMarryBabyWithSiteWide = Template.bind({})
-export const MobileMarryBaby = Template.bind({})
-export const MobileHelloBacsi = Template.bind({})
-export const DesktopHelloBacsi = Template.bind({})
-export const DesktopHelloBacsiWithSiteWide = Template.bind({})
-export const DesktopHelloBacsiWithLanguage = Template.bind({})
-export const DesktopHelloBacsiWithSponsor = Template.bind({})
-export const LoggedInDesktopHelloBacsi = Template.bind({})
-export const LoggedInMobileHelloBacsi = Template.bind({})
-export const LoggedInDesktopMarryBaby = Template.bind({})
-export const LoggedInMobileMarryBaby = Template.bind({})
-export const HelloBacsiAmp = Template.bind({})
-
-const defaultProps = {
-  isMobile: false,
-  MetaPageTitle: '',
-  MetaPageDescription: '',
-  image: '',
-  ssrMenuContent: {
-    categories: [],
-    healthTools: [],
-    careSpecialties: [],
-    togetherCommunities: [],
-  },
-  together: {
-    TOGETHER_MENU_COUNTRIES_ENABLED: ['vi-VN'],
-    togetherApiDomain: '',
-  },
-  care: {
-    CARE_MENU_COUNTRIES_ENABLED: ['vi-VN'],
-    ENABLE_CARE_PROFILE_MENU_LOCALES: ['vi-VN'],
-    menuActionType: 'redirectOnly',
-  },
-  marryBaby: {
-    tone: 'pink',
-  },
-  logoutHandlers: {
-    callPostLogOutApi: undefined,
-    isLogoutPopupOpened: false,
-    onClosePopup: undefined,
-    onLogout: undefined,
-  },
-  sso: {
-    dispatchLogout: undefined,
-    SSO_URL: '/',
-  },
-  callApiHandler: () => {
-    return null
-  },
-  basePath: '',
-  isAmp: false,
-  locale: 'tl-PH',
-  userProfileRouterPush: undefined,
-  routerPathname: '',
-  routerQuery: {},
-  routerAsPath: '',
-  nextHead: undefined,
-  userState: {
-    isLoggedIn: true,
-    isMobileSsr: true,
-    newBookmark: [0],
-    notifications: undefined,
-    openLogoutPopup: false,
-    userInfo: undefined,
-    sitewideClose: {},
-  },
-  siteType: 'helloSites',
-  translation: {
-    'home.navigator.menuItem.discover': 'check',
-    'home.navigator.menuItem.together': 'Community',
-  },
-  statics: {
-    TOGETHER_URL_FE: 'https://discover.hellobacsi.com/community',
-    CARE_URL_FE: 'https://discover.hellobacsi.com/care',
-  },
-  openAcceptCookieModal: true,
-} as unknown as Props
-
-const connectedUserState = {
-  ...defaultProps.userState,
-  isLoggedIn: true,
-  isMobileSsr: false,
-  newBookmark: [0],
-  notifications: undefined,
-  openLogoutPopup: true,
-  isCommentReleaseSSR: false,
-  sitewideClose: {},
-  userInfo: {
-    name: 'Lorem Ipsum',
-    username: 'Lorem Ipsum',
-    avatar: '',
-    email: 'loremipsum@gmail.com',
-    role: 'User',
-    id: 1,
-    bookmarks: [],
-    total_bookmark: 0,
-  },
-}
-
-DesktopMarryBaby.args = {
-  ...defaultProps,
-  siteType: 'marryBaby',
-  marryBaby: {
-    tone: 'white',
-    marryBabyApiDomain: 'https://staging.marrybaby.vn/',
-  },
-  care: { CARE_MENU_COUNTRIES_ENABLED: [] },
-  statics: {
-    HOME_PAGE_URL: 'https://marrybaby.vn',
-  },
-} as Props
-DesktopMarryBabyWithSiteWide.args = {
-  ...defaultProps,
-  siteType: 'marryBaby',
-  isMobile: false,
-  sitewideBanner: (
-    <SiteWide
-      icon={CloseWhiteIcon}
-      content="banner content"
-      siteType="marryBaby"
-    />
-  ),
-} as Props
-
-MobileMarryBaby.args = {
-  ...defaultProps,
-  siteType: 'marryBaby',
-  care: { CARE_MENU_COUNTRIES_ENABLED: [] },
-  isMobile: true,
-} as Props
-
-MobileHelloBacsi.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  isMobile: true,
-} as Props
-
-DesktopHelloBacsi.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  isMobile: false,
-} as Props
-DesktopHelloBacsiWithSiteWide.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  isMobile: false,
-  sitewideBanner: (
-    <SiteWide
-      icon={CloseWhiteIcon}
-      content="banner content"
-      siteType="helloSites"
-    />
-  ),
-} as Props
-DesktopHelloBacsiWithLanguage.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  isMobile: true,
-  languageOptions: [
-    {
-      value: '',
-      label: 'VI',
-    },
-    {
-      value: 'test2',
-      label: 'test2',
-    },
-  ],
-} as Props
-DesktopHelloBacsiWithSponsor.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  isMobile: false,
-  sponsorComponent: <StickySponsoredBy sponsoredType="article" />,
-} as Props
-
-LoggedInDesktopHelloBacsi.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  basePath: '/',
-  isMobile: false,
-  userState: {
-    ...connectedUserState,
-    isMobileSsr: false,
-  },
-  sso: {
-    dispatchLogout: undefined,
-    SSO_URL: '/',
-  },
-}
-
-LoggedInMobileHelloBacsi.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  basePath: '/',
-  isMobile: true,
-  userState: {
-    ...connectedUserState,
-    isMobileSsr: true,
-  },
-  sso: {
-    dispatchLogout: undefined,
-    SSO_URL: '/',
-  },
-}
-
-LoggedInMobileMarryBaby.args = {
-  ...defaultProps,
-  siteType: 'marryBaby',
-  basePath: '/',
-  isMobile: true,
-  userState: {
-    ...connectedUserState,
-    isMobileSsr: true,
-  },
-  sso: {
-    dispatchLogout: undefined,
-    SSO_URL: '/',
-  },
-}
-
-LoggedInDesktopMarryBaby.args = {
-  ...defaultProps,
-  siteType: 'marryBaby',
-  basePath: '/',
-  isMobile: false,
-  userState: {
-    ...connectedUserState,
-    isMobileSsr: false,
-  },
-  sso: {
-    dispatchLogout: undefined,
-    SSO_URL: '/',
-  },
-}
-
-HelloBacsiAmp.args = {
-  ...defaultProps,
-  siteType: 'helloSites',
-  basePath: '/',
-  isMobile: true,
-  userState: {
-    ...connectedUserState,
-    isMobileSsr: true,
-  },
-  sso: {
-    dispatchLogout: undefined,
-    SSO_URL: '/',
-  },
-  isAmp: false,
-}

package/src/components/organisms/navigationLayout/index.styled.tsx

@@ -1,153 +0,0 @@
-import { ThemeProps } from 'misc/theme'
-import styled from 'styled-components'
-
-export const StyledContainer = styled.div`
-  width: 100vw;
-`
-
-export const StyledHomeContainer = styled.div<{
-  hasStickyBottomBar: boolean
-}>`
-  @keyframes menuLeftToRightTrans {
-    from {
-      margin-left: -300%;
-      opacity: 0;
-    }
-    to {
-      margin-left: 0;
-      opacity: 1;
-    }
-  }
-
-  @keyframes menuRightToLeftTrans {
-    from {
-      margin-right: -300%;
-      opacity: 0;
-    }
-    to {
-      margin-right: 0;
-      opacity: 1;
-    }
-  }
-
-  @keyframes leftAppears {
-    from {
-      left: -50%;
-      opacity: 0;
-    }
-    to {
-      left: 0;
-      opacity: 1;
-    }
-  }
-
-  @keyframes leftDisappears {
-    from {
-      left: 0;
-      opacity: 1;
-    }
-    to {
-      left: -50%;
-      opacity: 0;
-    }
-  }
-
-  @keyframes rightAppears {
-    from {
-      right: -50%;
-      opacity: 0;
-    }
-    to {
-      right: 0;
-      opacity: 1;
-    }
-  }
-
-  @keyframes rightDisappears {
-    from {
-      right: 0;
-      opacity: 1;
-    }
-    to {
-      right: -50%;
-      opacity: 0;
-    }
-  }
-
-  @keyframes expandingTopToBottom {
-    from {
-      margin-top: -100%;
-      opacity: 0;
-    }
-    to {
-      margin-top: 0;
-      opacity: 1;
-    }
-  }
-
-  @keyframes collapsingBottomToTop {
-    from {
-      margin-top: 0;
-      opacity: 1;
-    }
-    to {
-      margin-top: -100%;
-      opacity: 0;
-    }
-  }
-
-  width: 100%;
-
-  ${(props) => props.hasStickyBottomBar && `padding-bottom: 80px;`}
-
-  background-color: ${(props: ThemeProps) => props.theme.colors.white};
-
-  &[data-menu-opened='true'] {
-    visibility: hidden;
-  }
-`
-
-export const StyledAmpHomeContainer = styled.div`
-  width: 100%;
-  padding-bottom: 80px;
-
-  background-color: ${(props: ThemeProps) => props.theme.colors.white};
-
-  &[data-is-mobile='false'] {
-    margin-top: 69px;
-    &[data-sponsored='true'] {
-      margin-top: 110px;
-      &[data-sitewide='true'] {
-        margin-top: 173px;
-      }
-    }
-    &[data-sitewide='true'] {
-      margin-top: 133px;
-    }
-  }
-  &[data-is-mobile='true'] {
-    &[data-sitewide='true'],
-    &[data-sponsored='true'] {
-      margin-top: 60px;
-    }
-  }
-
-  &[data-menu-opened='true'] {
-    visibility: hidden;
-  }
-`
-
-export const StyledMenuLanguageLabelContainer = styled.div`
-  display: flex;
-  align-items: center;
-  gap: 8px;
-`
-export const StyledLanguageChangeLink = styled.a`
-  &[data-is-active='true'] {
-    color: unset;
-  }
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 22px;
-  text-decoration: none;
-`