From 31294de36cf5f7eceb103ca981d2f858f39fbdb0 Mon Sep 17 00:00:00 2001
From: Resi Respati <resir014@gmail.com>
Date: Wed, 1 May 2019 12:12:22 +0700
Subject: [PATCH] [@types/next-server] add `next/amp` support (#35132)

---
 types/next-server/amp.d.ts                    | 12 ++++++++++
 .../test/next-server-amp-tests.tsx            | 23 +++++++++++++++++++
 types/next-server/tsconfig.json               |  2 ++
 types/next/amp.d.ts                           |  1 +
 types/next/tsconfig.json                      |  1 +
 5 files changed, 39 insertions(+)
 create mode 100644 types/next-server/amp.d.ts
 create mode 100644 types/next-server/test/next-server-amp-tests.tsx
 create mode 100644 types/next/amp.d.ts

diff --git a/types/next-server/amp.d.ts b/types/next-server/amp.d.ts
new file mode 100644
index 0000000000..46db2c3ade
--- /dev/null
+++ b/types/next-server/amp.d.ts
@@ -0,0 +1,12 @@
+import { NextComponentType } from "next";
+
+export interface WithAmpConfig {
+    hybrid: boolean;
+}
+
+export function withAmp(
+    Component: NextComponentType | React.ComponentType,
+    config?: WithAmpConfig
+): React.ComponentType;
+
+export function useAmp(): boolean;
diff --git a/types/next-server/test/next-server-amp-tests.tsx b/types/next-server/test/next-server-amp-tests.tsx
new file mode 100644
index 0000000000..e53b29ca35
--- /dev/null
+++ b/types/next-server/test/next-server-amp-tests.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+import { withAmp, useAmp } from "next-server/amp";
+
+function HomePage() {
+    return <p>Welcome to AMP + Next.js.</p>;
+}
+
+// 1. `withAmp()`
+export const WithAmp = withAmp(HomePage);
+
+// 2. `withAmp()` + config
+export const WithHybridAmp = withAmp(HomePage, { hybrid: true });
+
+// 3. `useAmp()` hook
+export function Image({ src, width, height }: any) {
+    const isAmp = useAmp();
+
+    // The 'amp-img' element is not in the JSX namespace, so for now we
+    // use `React.createElement()` to construct the amp-img element.
+    return isAmp ? React.createElement('amp-img', { src, width, height }) : (
+        <img src={src} width={width} height={height} />
+    );
+}
diff --git a/types/next-server/tsconfig.json b/types/next-server/tsconfig.json
index 07f4c18066..e42f9f11ac 100644
--- a/types/next-server/tsconfig.json
+++ b/types/next-server/tsconfig.json
@@ -20,6 +20,7 @@
     },
     "files": [
         "index.d.ts",
+        "amp.d.ts",
         "asset.d.ts",
         "config.d.ts",
         "constants.d.ts",
@@ -29,6 +30,7 @@
         "next-config.d.ts",
         "router.d.ts",
         "test/next-server-tests.ts",
+        "test/next-server-amp-tests.tsx",
         "test/next-server-constants-tests.ts",
         "test/next-server-head-tests.tsx",
         "test/next-server-link-tests.tsx",
diff --git a/types/next/amp.d.ts b/types/next/amp.d.ts
new file mode 100644
index 0000000000..f75a4f30be
--- /dev/null
+++ b/types/next/amp.d.ts
@@ -0,0 +1 @@
+export * from 'next-server/amp';
diff --git a/types/next/tsconfig.json b/types/next/tsconfig.json
index 41f6efc969..86dbd47ec2 100644
--- a/types/next/tsconfig.json
+++ b/types/next/tsconfig.json
@@ -21,6 +21,7 @@
     "files": [
         "index.d.ts",
         "constants.d.ts",
+        "amp.d.ts",
         "app.d.ts",
         "document.d.ts",
         "dynamic.d.ts",