feat: deprecate vue3 plugin (#351)

* feat(vue-vite-blank): replace vue3-plugin by composables-next

* chore: install api-client

* chore: changeset

* Update packages/vue3-plugin/README.md

---------

Co-authored-by: Patryk Tomczyk <13100280+patzick@users.noreply.github.com>

.changeset/afraid-flowers-search.md

@@ -0,0 +1,5 @@
+---
+"vue-vite-blank": patch
+---
+
+Change the way how Shopware Context plugin is created

.changeset/six-weeks-travel.md

@@ -0,0 +1,5 @@
+---
+"@shopware-pwa/vue3-plugin": patch
+---
+
+Mark package as deprecated

packages/vue3-plugin/README.md

@@ -0,0 +1,5 @@
+# Frontends plugin for Vue 3
+
+## ⚠️ DEPRECATED
+
+The plugin can be created by using `createInstance` method of `@shopware-pwa/composables-next` package. [See the details](https://www.npmjs.com/package/@shopware-pwa/composables-next).

packages/vue3-plugin/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shopware-pwa/vue3-plugin",
   "version": "0.1.36",
-  "description": "Shopware Fromends Vue3 plugin",
+  "description": "Shopware Frontends plugin for Vue 3. DEPRECATED.",
   "author": "Shopware",
   "repository": {
     "type": "git",
@@ -42,4 +42,4 @@
   "peerDependencies": {
     "vue": "^3.3.4"
   }
-}
+}

templates/vue-vite-blank/package.json

@@ -9,8 +9,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@shopware-pwa/api-client": "canary",
     "@shopware-pwa/composables-next": "canary",
-    "@shopware-pwa/vue3-plugin": "canary",
     "vue": "^3.3.4"
   },
   "devDependencies": {
@@ -22,4 +22,4 @@
   "engines": {
     "node": "^16.x || ^18.x"
   }
-}
+}

templates/vue-vite-blank/src/main.ts

@@ -1,18 +1,24 @@
 import { createApp } from "vue";
 import "./style.css";
 import App from "./App.vue";
-import ShopwareContext, {
-  ShopwareFrontendsOptions,
-} from "@shopware-pwa/vue3-plugin";
+
+import { createShopwareContext } from "@shopware-pwa/composables-next";
+import { createInstance } from "@shopware-pwa/api-client";
+
+const apiInstance = createInstance({
+  endpoint: import.meta.env.VITE_DEMO_API_URL,
+  accessToken: import.meta.env.VITE_DEMO_API_ACCESS_TOKEN,
+});
 
 const app = createApp(App);
 
 // setup shopware plugin
-const options: ShopwareFrontendsOptions = {
-  shopwareEndpoint: import.meta.env.VITE_DEMO_API_URL,
-  shopwareAccessToken: import.meta.env.VITE_DEMO_API_ACCESS_TOKEN,
-};
-// register the plugin
-app.use(ShopwareContext, options);
+const shopwareContext = createShopwareContext(app, {
+  apiInstance,
+  // devStorefrontUrl: "https://your-sales-channel-configured-domain.com",
+});
+
+// register a plugin in a Vue instance
+app.use(shopwareContext);
 
 app.mount("#app");