Merge pull request #1 from google-pay/add-idx-button

open in IDX button

README.md

@@ -1,5 +1,21 @@
 # Google Pay Web Checkout Playground
 
+<!--- Open in IDX button -->
+<a href="https://idx.google.com/new?template=https://github.com/google-pay/online-quickstart-web">
+  <picture>
+    <source
+      media="(prefers-color-scheme: dark)"
+      srcset="https://cdn.idx.dev/btn/open_dark_32.svg">
+    <source
+      media="(prefers-color-scheme: light)"
+      srcset="https://cdn.idx.dev/btn/open_light_32.svg">
+    <img
+      height="32"
+      alt="Open in IDX"
+      src="https://cdn.idx.dev/btn/open_purple_32.svg">
+  </picture>
+</a>
+
 Use this playground environment to experiment integrating Google Pay, as if you were working directly from your own checkout page.
 
 <p align="center">

dev.nix

@@ -0,0 +1,50 @@
+/*
+ Copyright 2024 Google LLC
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+
+# To learn more about how to use Nix to configure your environment
+# see: https://developers.google.com/idx/guides/customize-idx-env
+{ pkgs, ... }: {
+  # Which nixpkgs channel to use.
+  channel = "stable-24.05"; # or "unstable"
+
+  # Use https://search.nixos.org/packages to find packages
+  packages = [
+    pkgs.python311
+  ];
+
+  # Sets environment variables in the workspace
+  env = {};
+  idx = {
+    workspace = {
+      onCreate = {
+        default.openFiles = [          
+          "index.html"
+          "index.js"
+        ];
+      };
+    };
+
+    previews = {
+      enable = true;
+      previews = {
+        web = {
+          command = ["python3" "-m" "http.server" "$PORT" "--bind" "0.0.0.0"];
+          manager = "web";
+        };
+      };
+    };
+  };
+}

idx-template.json

@@ -0,0 +1,8 @@
+{
+    "name": "Google Pay Web Checkout Playground",
+    "description": "Use this playground environment to experiment integrating Google Pay, as if you were working directly from your own checkout page.",
+    "categories": ["Web app", "Misc"],
+    "icon": "https://www.gstatic.com/images/branding/productlogos/google_pay_round/v6/192px.svg",
+    "publisher": "Google Pay DevRel",
+    "website": "https://pay-web-quickstart.web.app"
+  }

idx-template.nix

@@ -0,0 +1,25 @@
+/*
+ Copyright 2025 Google LLC
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+
+{ pkgs, ... }: {
+  bootstrap = ''    
+    mkdir "$out"
+    mkdir -p "$out/.idx/"
+    cp -rf ${./dev.nix} "$out/.idx/dev.nix"
+    shopt -s dotglob; cp -r ${./public}/* "$out"
+    chmod -R +w "$out"
+  '';
+}