@vtex/faststore-plugin-buyer-portal 1.1.115 → 1.1.116-experimental.20251010183930
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/workflows/experimental.yaml +70 -0
- package/package.json +1 -1
- package/src/features/shared/hooks/useCookieMonitor.ts +2 -6
- package/src/features/shared/types/AuthRouteProps.ts +1 -6
- package/src/features/shared/utils/withAuth.tsx +8 -22
- package/src/features/shared/utils/withAuthProvider.tsx +8 -28
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
# This Action runs on experimental branch and publishes an experimental version to npm
|
|
2
|
+
name: CD Experimental
|
|
3
|
+
|
|
4
|
+
on:
|
|
5
|
+
push:
|
|
6
|
+
branches:
|
|
7
|
+
- experimental
|
|
8
|
+
|
|
9
|
+
jobs:
|
|
10
|
+
build:
|
|
11
|
+
name: BuyerPortal Experimental
|
|
12
|
+
timeout-minutes: 15
|
|
13
|
+
runs-on: ubuntu-latest
|
|
14
|
+
|
|
15
|
+
steps:
|
|
16
|
+
- name: Check out code
|
|
17
|
+
uses: actions/checkout@v4
|
|
18
|
+
with:
|
|
19
|
+
fetch-depth: 2
|
|
20
|
+
|
|
21
|
+
- name: Setup Node.js environment
|
|
22
|
+
uses: actions/setup-node@v4
|
|
23
|
+
with:
|
|
24
|
+
node-version: 20
|
|
25
|
+
cache: "yarn"
|
|
26
|
+
registry-url: "https://registry.npmjs.org"
|
|
27
|
+
|
|
28
|
+
- name: Configure CI Git User
|
|
29
|
+
run: |
|
|
30
|
+
git config user.name vtexgithubbot
|
|
31
|
+
git config user.email vtexgithubbot@github.com
|
|
32
|
+
|
|
33
|
+
- name: Install dependencies
|
|
34
|
+
run: yarn
|
|
35
|
+
|
|
36
|
+
- name: Get current version
|
|
37
|
+
id: get_version
|
|
38
|
+
run: |
|
|
39
|
+
CURRENT_VERSION=$(node -p "require('./package.json').version")
|
|
40
|
+
echo "current_version=$CURRENT_VERSION" >> $GITHUB_OUTPUT
|
|
41
|
+
|
|
42
|
+
- name: Generate experimental version
|
|
43
|
+
id: generate_version
|
|
44
|
+
run: |
|
|
45
|
+
# Extract base version (remove any existing prerelease suffix)
|
|
46
|
+
BASE_VERSION=$(echo "${{ steps.get_version.outputs.current_version }}" | sed -E 's/(-.*)?$//')
|
|
47
|
+
# Generate timestamp-based identifier
|
|
48
|
+
TIMESTAMP=$(date +%Y%m%d%H%M%S)
|
|
49
|
+
# Create experimental version
|
|
50
|
+
EXPERIMENTAL_VERSION="${BASE_VERSION}-experimental.${TIMESTAMP}"
|
|
51
|
+
echo "experimental_version=$EXPERIMENTAL_VERSION" >> $GITHUB_OUTPUT
|
|
52
|
+
echo "Publishing experimental version: $EXPERIMENTAL_VERSION"
|
|
53
|
+
|
|
54
|
+
- name: Update package.json version
|
|
55
|
+
run: |
|
|
56
|
+
npm version ${{ steps.generate_version.outputs.experimental_version }} --no-git-tag-version
|
|
57
|
+
|
|
58
|
+
- name: Publish experimental version
|
|
59
|
+
run: yarn publish --non-interactive --tag experimental
|
|
60
|
+
env:
|
|
61
|
+
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
|
|
62
|
+
|
|
63
|
+
- name: Push changes and tags
|
|
64
|
+
run: |
|
|
65
|
+
git config user.email "vtexgithubbot@github.com"
|
|
66
|
+
git config user.name "vtexgithubbot"
|
|
67
|
+
git add package.json
|
|
68
|
+
git commit -m "chore: publish experimental version ${{ steps.generate_version.outputs.experimental_version }}" || echo "No changes to commit"
|
|
69
|
+
git push origin experimental || echo "No changes to push"
|
|
70
|
+
|
package/package.json
CHANGED
|
@@ -12,7 +12,6 @@ import { AUT_COOKIE_KEY } from "../utils/constants";
|
|
|
12
12
|
*/
|
|
13
13
|
export const useCookieMonitor = () => {
|
|
14
14
|
const [hasCookie, setHasCookie] = useState(false);
|
|
15
|
-
const [timedOut, setTimedOut] = useState(false);
|
|
16
15
|
|
|
17
16
|
useEffect(() => {
|
|
18
17
|
const checkCookie = () => {
|
|
@@ -59,10 +58,7 @@ export const useCookieMonitor = () => {
|
|
|
59
58
|
|
|
60
59
|
// Cleanup after 5 seconds max
|
|
61
60
|
const timeout = setTimeout(() => {
|
|
62
|
-
console.log(
|
|
63
|
-
"[useCookieMonitor] Polling timeout reached (5s) - cookie never appeared"
|
|
64
|
-
);
|
|
65
|
-
setTimedOut(true);
|
|
61
|
+
console.log("[useCookieMonitor] Polling timeout reached (5s)");
|
|
66
62
|
clearInterval(interval);
|
|
67
63
|
}, 5000);
|
|
68
64
|
|
|
@@ -73,5 +69,5 @@ export const useCookieMonitor = () => {
|
|
|
73
69
|
}
|
|
74
70
|
}, []);
|
|
75
71
|
|
|
76
|
-
return
|
|
72
|
+
return hasCookie;
|
|
77
73
|
};
|
|
@@ -3,9 +3,4 @@ import { ClientContext } from "../utils";
|
|
|
3
3
|
export type AuthRouteProps<T> =
|
|
4
4
|
| { authorized: true; data: T; clientContext: ClientContext; loading: false }
|
|
5
5
|
| { authorized: false; loading: false }
|
|
6
|
-
| {
|
|
7
|
-
authorized: false;
|
|
8
|
-
loading: true;
|
|
9
|
-
data?: Partial<T>;
|
|
10
|
-
clientContext?: ClientContext;
|
|
11
|
-
};
|
|
6
|
+
| { authorized: false; loading: true };
|
|
@@ -2,6 +2,7 @@ import { useEffect, useRef, type ComponentType } from "react";
|
|
|
2
2
|
|
|
3
3
|
import { useRouter } from "next/router";
|
|
4
4
|
|
|
5
|
+
import { PageLoader } from "../components";
|
|
5
6
|
import { useCookieMonitor } from "../hooks/useCookieMonitor";
|
|
6
7
|
|
|
7
8
|
import type { AuthRouteProps } from "../types";
|
|
@@ -15,7 +16,7 @@ export const withAuth = <T extends Record<string, unknown>>(
|
|
|
15
16
|
) => {
|
|
16
17
|
return function AuthenticatedComponent(props: AuthRouteProps<T>) {
|
|
17
18
|
const router = useRouter();
|
|
18
|
-
const
|
|
19
|
+
const hasCookie = useCookieMonitor();
|
|
19
20
|
const reloadAttemptedRef = useRef(false);
|
|
20
21
|
|
|
21
22
|
// Debug logging
|
|
@@ -24,10 +25,9 @@ export const withAuth = <T extends Record<string, unknown>>(
|
|
|
24
25
|
authorized: props?.authorized,
|
|
25
26
|
loading: props?.loading,
|
|
26
27
|
hasCookie,
|
|
27
|
-
timedOut,
|
|
28
28
|
reloadAttempted: reloadAttemptedRef.current,
|
|
29
29
|
});
|
|
30
|
-
}, [props?.authorized, props?.loading, hasCookie
|
|
30
|
+
}, [props?.authorized, props?.loading, hasCookie]);
|
|
31
31
|
|
|
32
32
|
useEffect(() => {
|
|
33
33
|
// If not authorized and not loading, reload the page
|
|
@@ -56,28 +56,14 @@ export const withAuth = <T extends Record<string, unknown>>(
|
|
|
56
56
|
}
|
|
57
57
|
}, [props?.loading, hasCookie, router]);
|
|
58
58
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
console.log("[withAuth] Cookie timeout - redirecting to home page");
|
|
63
|
-
reloadAttemptedRef.current = true;
|
|
64
|
-
router.push("/");
|
|
59
|
+
if (!props?.authorized) {
|
|
60
|
+
if (props?.loading) {
|
|
61
|
+
return <PageLoader />;
|
|
65
62
|
}
|
|
66
|
-
}, [props?.loading, timedOut, router]);
|
|
67
|
-
|
|
68
|
-
// Always render the component, but pass loading state
|
|
69
|
-
// This allows components to handle their own loading states
|
|
70
|
-
if (!props?.authorized && !props?.loading) {
|
|
71
|
-
// Not authorized and not loading = permanently denied
|
|
72
63
|
return null;
|
|
73
64
|
}
|
|
74
65
|
|
|
75
|
-
//
|
|
76
|
-
|
|
77
|
-
...(props?.data || ({} as T)),
|
|
78
|
-
loading: props?.loading || false,
|
|
79
|
-
} as T & { loading: boolean };
|
|
80
|
-
|
|
81
|
-
return <Component {...componentProps} />;
|
|
66
|
+
// If authorized, render the component with the data
|
|
67
|
+
return <Component {...(props.data as T)} />;
|
|
82
68
|
};
|
|
83
69
|
};
|
|
@@ -2,7 +2,7 @@ import { useEffect, useRef, type ComponentType } from "react";
|
|
|
2
2
|
|
|
3
3
|
import { useRouter } from "next/router";
|
|
4
4
|
|
|
5
|
-
import { BuyerPortalProvider } from "../components";
|
|
5
|
+
import { BuyerPortalProvider, PageLoader } from "../components";
|
|
6
6
|
import { useCookieMonitor } from "../hooks/useCookieMonitor";
|
|
7
7
|
|
|
8
8
|
import type { AuthRouteProps } from "../types";
|
|
@@ -18,7 +18,7 @@ export const withAuthProvider = <T,>(
|
|
|
18
18
|
) => {
|
|
19
19
|
return function WrappedPage(props: AuthRouteProps<T>) {
|
|
20
20
|
const router = useRouter();
|
|
21
|
-
const
|
|
21
|
+
const hasCookie = useCookieMonitor();
|
|
22
22
|
const reloadAttemptedRef = useRef(false);
|
|
23
23
|
const isProduction = process.env.NODE_ENV === "production";
|
|
24
24
|
|
|
@@ -29,7 +29,6 @@ export const withAuthProvider = <T,>(
|
|
|
29
29
|
authorized: props?.authorized,
|
|
30
30
|
loading: props?.loading,
|
|
31
31
|
hasCookie,
|
|
32
|
-
timedOut,
|
|
33
32
|
reloadAttempted: reloadAttemptedRef.current,
|
|
34
33
|
routerPath: router.asPath,
|
|
35
34
|
});
|
|
@@ -38,7 +37,6 @@ export const withAuthProvider = <T,>(
|
|
|
38
37
|
props?.authorized,
|
|
39
38
|
props?.loading,
|
|
40
39
|
hasCookie,
|
|
41
|
-
timedOut,
|
|
42
40
|
router.asPath,
|
|
43
41
|
isProduction,
|
|
44
42
|
]);
|
|
@@ -73,35 +71,17 @@ export const withAuthProvider = <T,>(
|
|
|
73
71
|
}
|
|
74
72
|
}, [props?.loading, hasCookie, router]);
|
|
75
73
|
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
"[withAuthProvider] Cookie timeout - redirecting to home page"
|
|
81
|
-
);
|
|
82
|
-
reloadAttemptedRef.current = true;
|
|
83
|
-
router.push("/");
|
|
74
|
+
if (!props?.authorized) {
|
|
75
|
+
if (props?.loading) {
|
|
76
|
+
console.log("[withAuthProvider] Loading state");
|
|
77
|
+
return <PageLoader />;
|
|
84
78
|
}
|
|
85
|
-
}, [props?.loading, timedOut, router]);
|
|
86
|
-
|
|
87
|
-
// Always render the component, but pass loading state
|
|
88
|
-
// This allows components to handle their own loading states
|
|
89
|
-
if (!props?.authorized && !props?.loading) {
|
|
90
|
-
// Not authorized and not loading = permanently denied
|
|
91
79
|
return null;
|
|
92
80
|
}
|
|
93
81
|
|
|
94
|
-
// Render with whatever data we have (might be empty/partial if loading)
|
|
95
|
-
const componentProps = {
|
|
96
|
-
...(props?.data || ({} as T)),
|
|
97
|
-
loading: props?.loading || false,
|
|
98
|
-
} as T & { loading: boolean };
|
|
99
|
-
|
|
100
|
-
const clientContext = props?.clientContext || ({} as ClientContext);
|
|
101
|
-
|
|
102
82
|
return (
|
|
103
|
-
<BuyerPortalProvider clientContext={clientContext}>
|
|
104
|
-
<Component {...
|
|
83
|
+
<BuyerPortalProvider clientContext={props?.clientContext}>
|
|
84
|
+
<Component {...props.data} clientContext={props?.clientContext} />
|
|
105
85
|
</BuyerPortalProvider>
|
|
106
86
|
);
|
|
107
87
|
};
|