/ src / components / structure / MetaTags.svelte
MetaTags.svelte
 1  <script lang="ts">
 2      import type { Opt } from '@jet/environment/types/optional';
 3      import type { Organization, WithContext } from 'schema-dts';
 4      import type { WebRenderablePage } from '@jet-app/app-store/api/models/web-renderable-page';
 5  
 6      import MetaTags from '@amp/web-app-components/src/components/MetaTags/MetaTags.svelte';
 7      import type { SeoData } from '@amp/web-app-components/src/components/MetaTags/types';
 8      import { getLocale } from '@amp/web-app-components/src/utils/internal/locale';
 9      import { getPageDir } from '@amp/web-apps-localization/src';
10  
11      import { getI18n } from '~/stores/i18n';
12  
13      export let page: WebRenderablePage;
14  
15      const i18n = getI18n();
16      const locale = getLocale();
17  
18      const organizationSchema: WithContext<Organization> = {
19          '@context': 'https://schema.org',
20          '@id': 'https://apps.apple.com/#organization',
21          '@type': 'Organization',
22          name: 'App Store',
23          url: 'https://apps.apple.com',
24          logo: 'https://apps.apple.com/assets/app-store.png',
25          sameAs: [
26              'https://www.wikidata.org/wiki/Q368215',
27              'https://twitter.com/AppStore',
28              'https://www.instagram.com/appstore/',
29              'https://www.facebook.com/appstore/',
30          ],
31          parentOrganization: {
32              '@type': 'Organization',
33              name: 'Apple',
34              '@id': 'https://www.apple.com/#organization',
35              url: 'https://www.apple.com/',
36          },
37      };
38  
39      // This cast of `.seoData` is technically a little risky, but our app fully
40      // defines this property, which should make it fairly safe. Whatever is returned
41      // for the page from the `SEO` dependency on the Object Graph will be the value
42      // reflected here.
43      $: seoData = (page.seoData as Opt<SeoData>) ?? undefined;
44  
45      // Provide default title for pages not yet set up with SEO data
46      $: defaultTitle = $i18n.t('ASE.Web.AppStore.Meta.SiteName');
47      $: pageDir = getPageDir(locale.language) ?? 'ltr';
48  </script>
49  
50  <MetaTags
51      {defaultTitle}
52      {locale}
53      {pageDir}
54      {seoData}
55      origin={'https://apps.apple.com/'}
56  >
57      <svelte:fragment slot="schemaOrganizationData">
58          {#if import.meta.env.SSR}
59              <svelte:element
60                  this="script"
61                  id="organization"
62                  type="application/ld+json"
63              >
64                  {JSON.stringify(organizationSchema)}
65              </svelte:element>
66          {/if}
67      </svelte:fragment>
68  </MetaTags>