torin-asakura · kirill-ivanovvv · Nov 11, 2024 · Nov 15, 2024 · Nov 15, 2024 · Nov 15, 2024
diff --git a/.pnp.cjs b/.pnp.cjs
diff --git a/globals/data/src/getters/google-amp-page.getter.ts b/globals/data/src/getters/google-amp-page.getter.ts
@@ -0,0 +1,24 @@
+type GetGoogleAmpPageProps = {
+  bodyContent: string
+  // TODO title, canonical link
+}
+
+type GetGoogleAmpPageReturnType = string
+
+type GetGoogleAmpPageType = (props: GetGoogleAmpPageProps) => GetGoogleAmpPageReturnType
+
+export const getGoogleAmpPage: GetGoogleAmpPageType = ({ bodyContent }) =>
+  `<!doctype html>
+<html amp lang="en">
+  <head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <title>Hello, AMPs</title>
+    <link rel="canonical" href="https://amp.dev/documentation/guides-and-tutorials/start/create/basic_markup/">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  </head>
+  <body>
+		${bodyContent}
+  </body>
+</html>`
diff --git a/globals/data/src/getters/index.ts b/globals/data/src/getters/index.ts
@@ -1,2 +1,5 @@
 export * from './get-seo-metadata.getter.js'
 export * from './aqsi-data-getter/index.js'
+
+export * from './jsx-html-string.getter.js'
+export * from './google-amp-page.getter.js'
diff --git a/globals/data/src/getters/jsx-html-string.getter.ts b/globals/data/src/getters/jsx-html-string.getter.ts
@@ -0,0 +1,5 @@
+export const getJsxHtmlString = async (component: JSX.Element): Promise<string> => {
+  const ReactDOMServer = (await import('react-dom/server')).default
+  const staticMarkup = ReactDOMServer.renderToStaticMarkup(component)
+  return staticMarkup
+}
diff --git a/google-amp/fragments/before-after-fragment/package.json b/google-amp/fragments/before-after-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/before-after-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/before-after-fragment/src/before-after-fragment.component.tsx b/google-amp/fragments/before-after-fragment/src/before-after-fragment.component.tsx
@@ -0,0 +1,5 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const BeforeAfterFragment: FC = () => <h1>*** before-after interfactive component</h1>
diff --git a/google-amp/fragments/before-after-fragment/src/index.ts b/google-amp/fragments/before-after-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './before-after-fragment.component.js'
diff --git a/google-amp/fragments/blog-posts-list-fragment/package.json b/google-amp/fragments/blog-posts-list-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/blog-posts-list-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/blog-posts-list-fragment/src/blog-posts-list-fragment.component.tsx b/google-amp/fragments/blog-posts-list-fragment/src/blog-posts-list-fragment.component.tsx
@@ -0,0 +1,5 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const BlogPostsList: FC = () => <h1>*** blog-posts-list-fragment</h1>
diff --git a/google-amp/fragments/blog-posts-list-fragment/src/index.ts b/google-amp/fragments/blog-posts-list-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './blog-posts-list-fragment.component.js'
diff --git a/google-amp/fragments/contacts-info-fragment/package.json b/google-amp/fragments/contacts-info-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/contacts-info-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/contacts-info-fragment/src/contacts-info-fragment.component.tsx b/google-amp/fragments/contacts-info-fragment/src/contacts-info-fragment.component.tsx
@@ -0,0 +1,5 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const ContactsInfoFragment: FC = () => <h1>contacts-info</h1>
diff --git a/google-amp/fragments/contacts-info-fragment/src/index.ts b/google-amp/fragments/contacts-info-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './contacts-info-fragment.component.js'
diff --git a/google-amp/fragments/footer-fragment/package.json b/google-amp/fragments/footer-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/footer-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/footer-fragment/src/footer-fragment.component.tsx b/google-amp/fragments/footer-fragment/src/footer-fragment.component.tsx
@@ -0,0 +1,14 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const FooterFragment: FC = () => (
+  <>
+    <h1>*** footer-fragment</h1>
+    <h2>services-link</h2>
+    <h2>contacts-link</h2>
+    <h2>blog-link</h2>
+    <h2>contacts-list with worktime</h2>
+    <h2>logo-fragment/component?</h2>
+  </>
+)
diff --git a/google-amp/fragments/footer-fragment/src/index.ts b/google-amp/fragments/footer-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './footer-fragment.component.js'
diff --git a/google-amp/fragments/header-fragment/package.json b/google-amp/fragments/header-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/header-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/header-fragment/src/header-fragment.component.tsx b/google-amp/fragments/header-fragment/src/header-fragment.component.tsx
@@ -0,0 +1,13 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const HeaderFragment: FC = () => (
+  <>
+    <h2>logo</h2>
+    <h2>services-link</h2>
+    <h2>contacts-link</h2>
+    <h2>blog-link</h2>
+    <h2>target-action-link?</h2>
+  </>
+)
diff --git a/google-amp/fragments/header-fragment/src/index.ts b/google-amp/fragments/header-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './header-fragment.component.js'
diff --git a/google-amp/fragments/hero-fragment/package.json b/google-amp/fragments/hero-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/hero-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/hero-fragment/src/hero-fragment.component.tsx b/google-amp/fragments/hero-fragment/src/hero-fragment.component.tsx
@@ -0,0 +1,13 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const HeroFragment: FC = () => (
+  <>
+    <h1>*** hero-fragment</h1>
+    <h2>title</h2>
+    <h2>image</h2>
+    <h2>contacts</h2>
+    <h3>target action (zapisatsa)</h3>
+  </>
+)
diff --git a/google-amp/fragments/hero-fragment/src/index.ts b/google-amp/fragments/hero-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './hero-fragment.component.js'
diff --git a/google-amp/fragments/map-fragment/package.json b/google-amp/fragments/map-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/map-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/map-fragment/src/index.ts b/google-amp/fragments/map-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './map-fragment.component.js'
diff --git a/google-amp/fragments/map-fragment/src/map-fragment.component.tsx b/google-amp/fragments/map-fragment/src/map-fragment.component.tsx
@@ -0,0 +1,5 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const MapFragment: FC = () => <h1>map</h1>
diff --git a/google-amp/fragments/service-fragment/package.json b/google-amp/fragments/service-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/service-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/service-fragment/src/index.ts b/google-amp/fragments/service-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './service-fragment.component.js'
diff --git a/google-amp/fragments/service-fragment/src/service-fragment.component.tsx b/google-amp/fragments/service-fragment/src/service-fragment.component.tsx
@@ -0,0 +1,11 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const ServiceFragment: FC = () => (
+  <>
+    <h1>услуга</h1>
+    <h2>изображенияе</h2>
+    <h2>цена, за что цена</h2>
+  </>
+)
diff --git a/google-amp/fragments/services-list-fragment/package.json b/google-amp/fragments/services-list-fragment/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@google-amp/services-list-fragment",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/fragments/services-list-fragment/src/index.ts b/google-amp/fragments/services-list-fragment/src/index.ts
@@ -0,0 +1 @@
+export * from './services-list-fragment.component.js'
diff --git a/google-amp/fragments/services-list-fragment/src/services-list-fragment.component.tsx b/google-amp/fragments/services-list-fragment/src/services-list-fragment.component.tsx
@@ -0,0 +1,5 @@
+import type { FC } from 'react'
+
+import React       from 'react'
+
+export const ServicesListFragment: FC = () => <h1>*** services-list-fragment</h1>
diff --git a/google-amp/pages/contacts-page/package.json b/google-amp/pages/contacts-page/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "@google-amp/contacts-page",
+  "version": "0.0.1",
+  "license": "BSD-3-Clause",
+  "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "main": "src/index.ts",
+  "dependencies": {
+    "@google-amp/contacts-info-fragment": "workspace:*",
+    "@google-amp/footer-fragment": "workspace:*",
+    "@google-amp/header-fragment": "workspace:*",
+    "@google-amp/map-fragment": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/react": "18.3.3",
+    "@types/react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
+  }
+}
diff --git a/google-amp/pages/contacts-page/src/contacts-page.component.tsx b/google-amp/pages/contacts-page/src/contacts-page.component.tsx
@@ -0,0 +1,17 @@
+import type { FC }              from 'react'
+
+import React                    from 'react'
+
+import { ContactsInfoFragment } from '@google-amp/contacts-info-fragment'
+import { FooterFragment }       from '@google-amp/footer-fragment'
+import { HeaderFragment }       from '@google-amp/header-fragment'
+import { MapFragment }          from '@google-amp/map-fragment'
+
+export const ContactsPage: FC = () => (
+  <>
+    <HeaderFragment />
+    <ContactsInfoFragment />
+    <MapFragment />
+    <FooterFragment />
+  </>
+)
diff --git a/google-amp/pages/contacts-page/src/index.ts b/google-amp/pages/contacts-page/src/index.ts
@@ -0,0 +1 @@
+export * from './contacts-page.component.js'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export * from './before-after-fragment.component.js'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export * from './blog-posts-list-fragment.component.js'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export * from './contacts-info-fragment.component.js'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export * from './service-fragment.component.js'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export * from './services-list-fragment.component.js'