Skip to content

Commit

Permalink
Merge pull request #9 from joaoD3V/nudge-image
Browse files Browse the repository at this point in the history 
Nudge Image
  • Loading branch information
@Quelvinmp
Quelvinmp authored Nov 4, 2023
2 parents 1143185 + 77184e9 commit 74537a2
Show file tree
Hide file tree
Showing 8 changed files with 151 additions and 110 deletions.
2 changes: 1 addition & 1 deletion .release.json
View file

Large diffs are not rendered by default.

30 changes: 16 additions & 14 deletions fresh.gen.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,13 +21,14 @@ import * as $$14 from "./islands/Nudge/FlashOffer.tsx";
import * as $$15 from "./islands/Nudge/FreeDelivery.tsx";
import * as $$16 from "./islands/Nudge/LowStock.tsx";
import * as $$17 from "./islands/Nudge/Nudge.tsx";
import * as $$18 from "./islands/Nudge/PeopleWhoBought.tsx";
import * as $$19 from "./islands/OutOfStock.tsx";
import * as $$20 from "./islands/ProductImageZoom.tsx";
import * as $$21 from "./islands/SearchControls.tsx";
import * as $$22 from "./islands/ShippingSimulation.tsx";
import * as $$23 from "./islands/SliderJS.tsx";
import * as $$24 from "./islands/WishlistButton.tsx";
import * as $$18 from "./islands/Nudge/NudgeImage.tsx";
import * as $$19 from "./islands/Nudge/PeopleWhoBought.tsx";
import * as $$20 from "./islands/OutOfStock.tsx";
import * as $$21 from "./islands/ProductImageZoom.tsx";
import * as $$22 from "./islands/SearchControls.tsx";
import * as $$23 from "./islands/ShippingSimulation.tsx";
import * as $$24 from "./islands/SliderJS.tsx";
import * as $$25 from "./islands/WishlistButton.tsx";

const manifest = {
routes: {
Expand All @@ -52,13 +53,14 @@ const manifest = {
"./islands/Nudge/FreeDelivery.tsx": $$15,
"./islands/Nudge/LowStock.tsx": $$16,
"./islands/Nudge/Nudge.tsx": $$17,
"./islands/Nudge/PeopleWhoBought.tsx": $$18,
"./islands/OutOfStock.tsx": $$19,
"./islands/ProductImageZoom.tsx": $$20,
"./islands/SearchControls.tsx": $$21,
"./islands/ShippingSimulation.tsx": $$22,
"./islands/SliderJS.tsx": $$23,
"./islands/WishlistButton.tsx": $$24,
"./islands/Nudge/NudgeImage.tsx": $$18,
"./islands/Nudge/PeopleWhoBought.tsx": $$19,
"./islands/OutOfStock.tsx": $$20,
"./islands/ProductImageZoom.tsx": $$21,
"./islands/SearchControls.tsx": $$22,
"./islands/ShippingSimulation.tsx": $$23,
"./islands/SliderJS.tsx": $$24,
"./islands/WishlistButton.tsx": $$25,
},
baseUrl: import.meta.url,
};
Expand Down
29 changes: 20 additions & 9 deletions islands/Nudge/LowStock.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Nudge, { NudgeBaseProps } from "$store/islands/Nudge/Nudge.tsx";
import { AvailableIcons } from "$store/components/ui/Icon.tsx";
import NudgeImage from "./NudgeImage.tsx";

export interface Props {
/**
Expand All @@ -12,12 +13,18 @@ export interface Props {
*/
maxQuantityToShow: number;

/**
* @title Product image URL
*/
imageURL?: string;

nudge?: Partial<Omit<NudgeBaseProps, "isFlashOffer">>;
}

function LowStock({
maxQuantityToShow = 100,
stock = 100,
imageURL,
nudge,
}: Props) {
if (stock > maxQuantityToShow) return null;
Expand All @@ -36,15 +43,19 @@ function LowStock({

return (
<Nudge {...nudgeProps}>
<p className="text-base font-medium text-zinc-800 tracking-wider leading-relaxed">
<strong className="font-bold">Se apresse!</strong> Apenas{" "}
<strong
className={`text-${[nudgeProps.badge.accentColor]}-800 font-bold`}
>
{stock}
</strong>{" "}
{stock > 1 ? "unidades disponíveis!" : "unidade disponível!"}
</p>
<div className="flex gap-3 items-center">
<p className="text-base font-medium text-zinc-800 tracking-wider leading-relaxed">
<strong className="font-bold">Se apresse!</strong> Apenas{" "}
<strong
className={`text-${[nudgeProps.badge.accentColor]}-800 font-bold`}
>
{stock}
</strong>{" "}
{stock > 1 ? "unidades disponíveis!" : "unidade disponível!"}
</p>

{imageURL && <NudgeImage imageURL={imageURL} />}
</div>
</Nudge>
);
}
Expand Down
2 changes: 1 addition & 1 deletion islands/Nudge/Nudge.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ function Nudge({

return (
<div
className={`flex flex-col items-start justify-start gap-3.5 p-4 shadow-2xl bg-white fixed z-50 rounded-lg max-w-[354px] ${
className={`flex flex-col items-start justify-start gap-3.5 p-4 shadow-2xl bg-white fixed z-50 rounded-lg max-w-[354px] group ${
POSITION_STYLE[position]
}`}
>
Expand Down
9 changes: 9 additions & 0 deletions islands/Nudge/NudgeImage.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export interface Props {
imageURL: string;
}

function NudgeImage({imageURL}: Props) {
return <img src={imageURL} alt="" className="w-20 h-20 group-hover:scale-105 transition-transform"/>
}

export default NudgeImage;
35 changes: 27 additions & 8 deletions islands/Nudge/PeopleWhoBought.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,29 @@
import Nudge, { NudgeBaseProps } from "$store/islands/Nudge/Nudge.tsx";
import NudgeImage from "./NudgeImage.tsx";

export interface Props {
/**
* @title Minimum sales quantity to enable people who bought
*/
minQuantityToShow: number;

/**
* @title Total sales quantity
*/
quantityOfBought: number;

/**
* @title Product image URL
*/
imageURL?: string;

nudge?: Partial<Omit<NudgeBaseProps, "isFlashOffer">>;
}

function PeopleWhoBought({
minQuantityToShow = 100,
quantityOfBought = 100,
imageURL,
nudge,
}: Props) {
if (quantityOfBought < minQuantityToShow) return null;
Expand All @@ -27,14 +42,18 @@ function PeopleWhoBought({

return (
<Nudge {...nudgeProps}>
<p className="text-base font-medium text-zinc-800 tracking-wider leading-relaxed">
<strong
className={`text-${[nudgeProps.badge.accentColor]}-800 font-bold`}
>
+{quantityOfBought}
</strong>{" "}
pessoas compraram esse produto recentemente
</p>
<div className="flex gap-3 items-center">
<p className="text-base font-medium text-zinc-800 tracking-wider leading-relaxed">
<strong
className={`text-${[nudgeProps.badge.accentColor]}-800 font-bold`}
>
+{quantityOfBought}
</strong>{" "}
pessoas compraram esse produto recentemente
</p>

{imageURL && <NudgeImage imageURL={imageURL} />}
</div>
</Nudge>
);
}
Expand Down
152 changes: 76 additions & 76 deletions manifest.gen.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,94 +2,94 @@
// This file SHOULD be checked into source version control.
// This file is automatically updated during development when running `dev.ts`.

import * as $$$0 from "./loaders/Layouts/ProductCard.tsx";
import * as $$$1 from "./loaders/List/Sections.tsx";
import * as $$$$$$0 from "./sections/Gallery.tsx";
import * as $$$$$$1 from "./sections/Links/Shortcuts.tsx";
import * as $$$$$$2 from "./sections/Links/LinkTree.tsx";
import * as $$$$$$3 from "./sections/Footer/Footer.tsx";
import * as $$$$$$4 from "./sections/Miscellaneous/CampaignTimer.tsx";
import * as $$$$$$5 from "./sections/Miscellaneous/CookieConsent.tsx";
import * as $$$$$$6 from "./sections/Theme/Theme.tsx";
import * as $$$$$$7 from "./sections/Images/BannerGrid.tsx";
import * as $$$$$$8 from "./sections/Images/ImageGallery.tsx";
import * as $$$$$$9 from "./sections/Images/ShoppableBanner.tsx";
import * as $$$$$$10 from "./sections/Images/Carousel.tsx";
import * as $$$$$$11 from "./sections/Nudge/FlashOffer.tsx";
import * as $$$$$$12 from "./sections/Nudge/FreeDelivery.tsx";
import * as $$$$$$13 from "./sections/Nudge/PeopleWhoBought.tsx";
import * as $$$$$$14 from "./sections/Nudge/LowStock.tsx";
import * as $$$$$$15 from "./sections/Product/SearchResult.tsx";
import * as $$$$$$16 from "./sections/Product/NotFoundChallenge.tsx";
import * as $$$0 from "./loaders/List/Sections.tsx";
import * as $$$1 from "./loaders/Layouts/ProductCard.tsx";
import * as $$$$$$0 from "./sections/Nudge/FreeDelivery.tsx";
import * as $$$$$$1 from "./sections/Nudge/LowStock.tsx";
import * as $$$$$$2 from "./sections/Nudge/FlashOffer.tsx";
import * as $$$$$$3 from "./sections/Nudge/PeopleWhoBought.tsx";
import * as $$$$$$4 from "./sections/Footer/Footer.tsx";
import * as $$$$$$5 from "./sections/Miscellaneous/CampaignTimer.tsx";
import * as $$$$$$6 from "./sections/Miscellaneous/CookieConsent.tsx";
import * as $$$$$$7 from "./sections/Category/CategoryList.tsx";
import * as $$$$$$8 from "./sections/Category/CategoryBanner.tsx";
import * as $$$$$$9 from "./sections/Product/ProductShelfTabbed.tsx";
import * as $$$$$$10 from "./sections/Product/ProductShelf.tsx";
import * as $$$$$$11 from "./sections/Product/SearchResult.tsx";
import * as $$$$$$12 from "./sections/Product/ImageGalleryFrontBack.tsx";
import * as $$$$$$13 from "./sections/Product/NotFoundChallenge.tsx";
import * as $$$$$$14 from "./sections/Product/ImageGallerySlider.tsx";
import * as $$$$$$15 from "./sections/Product/NotFound.tsx";
import * as $$$$$$16 from "./sections/Product/Wishlist.tsx";
import * as $$$$$$17 from "./sections/Product/ProductInfo.tsx";
import * as $$$$$$18 from "./sections/Product/ImageGalleryFrontBack.tsx";
import * as $$$$$$19 from "./sections/Product/NotFound.tsx";
import * as $$$$$$20 from "./sections/Product/ProductShelfTabbed.tsx";
import * as $$$$$$21 from "./sections/Product/Wishlist.tsx";
import * as $$$$$$22 from "./sections/Product/ProductShelf.tsx";
import * as $$$$$$23 from "./sections/Product/ImageGallerySlider.tsx";
import * as $$$$$$24 from "./sections/Header/Header.tsx";
import * as $$$$$$25 from "./sections/Content/Benefits.tsx";
import * as $$$$$$18 from "./sections/Links/Shortcuts.tsx";
import * as $$$$$$19 from "./sections/Links/LinkTree.tsx";
import * as $$$$$$20 from "./sections/Social/InstagramPosts.tsx";
import * as $$$$$$21 from "./sections/Social/WhatsApp.tsx";
import * as $$$$$$22 from "./sections/Gallery.tsx";
import * as $$$$$$23 from "./sections/Content/Benefits.tsx";
import * as $$$$$$24 from "./sections/Content/Faq.tsx";
import * as $$$$$$25 from "./sections/Content/Logos.tsx";
import * as $$$$$$26 from "./sections/Content/Testimonials.tsx";
import * as $$$$$$27 from "./sections/Content/Faq.tsx";
import * as $$$$$$28 from "./sections/Content/Logos.tsx";
import * as $$$$$$29 from "./sections/Newsletter/Newsletter.tsx";
import * as $$$$$$30 from "./sections/Social/WhatsApp.tsx";
import * as $$$$$$31 from "./sections/Social/InstagramPosts.tsx";
import * as $$$$$$32 from "./sections/Layout/GridItem.tsx";
import * as $$$$$$33 from "./sections/Layout/Container.tsx";
import * as $$$$$$34 from "./sections/Layout/Grid.tsx";
import * as $$$$$$35 from "./sections/Layout/Flex.tsx";
import * as $$$$$$36 from "./sections/Category/CategoryList.tsx";
import * as $$$$$$37 from "./sections/Category/CategoryBanner.tsx";
import * as $$$$$$27 from "./sections/Images/BannerGrid.tsx";
import * as $$$$$$28 from "./sections/Images/Carousel.tsx";
import * as $$$$$$29 from "./sections/Images/ImageGallery.tsx";
import * as $$$$$$30 from "./sections/Images/ShoppableBanner.tsx";
import * as $$$$$$31 from "./sections/Header/Header.tsx";
import * as $$$$$$32 from "./sections/Newsletter/Newsletter.tsx";
import * as $$$$$$33 from "./sections/Theme/Theme.tsx";
import * as $$$$$$34 from "./sections/Layout/GridItem.tsx";
import * as $$$$$$35 from "./sections/Layout/Container.tsx";
import * as $$$$$$36 from "./sections/Layout/Flex.tsx";
import * as $$$$$$37 from "./sections/Layout/Grid.tsx";
import * as $$$$$$$$$$$0 from "./apps/site.ts";
import * as $$$$$$$$$$$1 from "./apps/decohub.ts";

const manifest = {
"loaders": {
"deco-sites/storefront/loaders/Layouts/ProductCard.tsx": $$$0,
"deco-sites/storefront/loaders/List/Sections.tsx": $$$1,
"deco-sites/storefront/loaders/Layouts/ProductCard.tsx": $$$1,
"deco-sites/storefront/loaders/List/Sections.tsx": $$$0,
},
"sections": {
"deco-sites/storefront/sections/Category/CategoryBanner.tsx": $$$$$$37,
"deco-sites/storefront/sections/Category/CategoryList.tsx": $$$$$$36,
"deco-sites/storefront/sections/Content/Benefits.tsx": $$$$$$25,
"deco-sites/storefront/sections/Content/Faq.tsx": $$$$$$27,
"deco-sites/storefront/sections/Content/Logos.tsx": $$$$$$28,
"deco-sites/storefront/sections/Category/CategoryBanner.tsx": $$$$$$8,
"deco-sites/storefront/sections/Category/CategoryList.tsx": $$$$$$7,
"deco-sites/storefront/sections/Content/Benefits.tsx": $$$$$$23,
"deco-sites/storefront/sections/Content/Faq.tsx": $$$$$$24,
"deco-sites/storefront/sections/Content/Logos.tsx": $$$$$$25,
"deco-sites/storefront/sections/Content/Testimonials.tsx": $$$$$$26,
"deco-sites/storefront/sections/Footer/Footer.tsx": $$$$$$3,
"deco-sites/storefront/sections/Gallery.tsx": $$$$$$0,
"deco-sites/storefront/sections/Header/Header.tsx": $$$$$$24,
"deco-sites/storefront/sections/Images/BannerGrid.tsx": $$$$$$7,
"deco-sites/storefront/sections/Images/Carousel.tsx": $$$$$$10,
"deco-sites/storefront/sections/Images/ImageGallery.tsx": $$$$$$8,
"deco-sites/storefront/sections/Images/ShoppableBanner.tsx": $$$$$$9,
"deco-sites/storefront/sections/Layout/Container.tsx": $$$$$$33,
"deco-sites/storefront/sections/Layout/Flex.tsx": $$$$$$35,
"deco-sites/storefront/sections/Layout/Grid.tsx": $$$$$$34,
"deco-sites/storefront/sections/Layout/GridItem.tsx": $$$$$$32,
"deco-sites/storefront/sections/Links/LinkTree.tsx": $$$$$$2,
"deco-sites/storefront/sections/Links/Shortcuts.tsx": $$$$$$1,
"deco-sites/storefront/sections/Miscellaneous/CampaignTimer.tsx": $$$$$$4,
"deco-sites/storefront/sections/Miscellaneous/CookieConsent.tsx": $$$$$$5,
"deco-sites/storefront/sections/Newsletter/Newsletter.tsx": $$$$$$29,
"deco-sites/storefront/sections/Nudge/FlashOffer.tsx": $$$$$$11,
"deco-sites/storefront/sections/Nudge/FreeDelivery.tsx": $$$$$$12,
"deco-sites/storefront/sections/Nudge/LowStock.tsx": $$$$$$14,
"deco-sites/storefront/sections/Nudge/PeopleWhoBought.tsx": $$$$$$13,
"deco-sites/storefront/sections/Footer/Footer.tsx": $$$$$$4,
"deco-sites/storefront/sections/Gallery.tsx": $$$$$$22,
"deco-sites/storefront/sections/Header/Header.tsx": $$$$$$31,
"deco-sites/storefront/sections/Images/BannerGrid.tsx": $$$$$$27,
"deco-sites/storefront/sections/Images/Carousel.tsx": $$$$$$28,
"deco-sites/storefront/sections/Images/ImageGallery.tsx": $$$$$$29,
"deco-sites/storefront/sections/Images/ShoppableBanner.tsx": $$$$$$30,
"deco-sites/storefront/sections/Layout/Container.tsx": $$$$$$35,
"deco-sites/storefront/sections/Layout/Flex.tsx": $$$$$$36,
"deco-sites/storefront/sections/Layout/Grid.tsx": $$$$$$37,
"deco-sites/storefront/sections/Layout/GridItem.tsx": $$$$$$34,
"deco-sites/storefront/sections/Links/LinkTree.tsx": $$$$$$19,
"deco-sites/storefront/sections/Links/Shortcuts.tsx": $$$$$$18,
"deco-sites/storefront/sections/Miscellaneous/CampaignTimer.tsx": $$$$$$5,
"deco-sites/storefront/sections/Miscellaneous/CookieConsent.tsx": $$$$$$6,
"deco-sites/storefront/sections/Newsletter/Newsletter.tsx": $$$$$$32,
"deco-sites/storefront/sections/Nudge/FlashOffer.tsx": $$$$$$2,
"deco-sites/storefront/sections/Nudge/FreeDelivery.tsx": $$$$$$0,
"deco-sites/storefront/sections/Nudge/LowStock.tsx": $$$$$$1,
"deco-sites/storefront/sections/Nudge/PeopleWhoBought.tsx": $$$$$$3,
"deco-sites/storefront/sections/Product/ImageGalleryFrontBack.tsx":
$$$$$$18,
"deco-sites/storefront/sections/Product/ImageGallerySlider.tsx": $$$$$$23,
"deco-sites/storefront/sections/Product/NotFound.tsx": $$$$$$19,
"deco-sites/storefront/sections/Product/NotFoundChallenge.tsx": $$$$$$16,
$$$$$$12,
"deco-sites/storefront/sections/Product/ImageGallerySlider.tsx": $$$$$$14,
"deco-sites/storefront/sections/Product/NotFound.tsx": $$$$$$15,
"deco-sites/storefront/sections/Product/NotFoundChallenge.tsx": $$$$$$13,
"deco-sites/storefront/sections/Product/ProductInfo.tsx": $$$$$$17,
"deco-sites/storefront/sections/Product/ProductShelf.tsx": $$$$$$22,
"deco-sites/storefront/sections/Product/ProductShelfTabbed.tsx": $$$$$$20,
"deco-sites/storefront/sections/Product/SearchResult.tsx": $$$$$$15,
"deco-sites/storefront/sections/Product/Wishlist.tsx": $$$$$$21,
"deco-sites/storefront/sections/Social/InstagramPosts.tsx": $$$$$$31,
"deco-sites/storefront/sections/Social/WhatsApp.tsx": $$$$$$30,
"deco-sites/storefront/sections/Theme/Theme.tsx": $$$$$$6,
"deco-sites/storefront/sections/Product/ProductShelf.tsx": $$$$$$10,
"deco-sites/storefront/sections/Product/ProductShelfTabbed.tsx": $$$$$$9,
"deco-sites/storefront/sections/Product/SearchResult.tsx": $$$$$$11,
"deco-sites/storefront/sections/Product/Wishlist.tsx": $$$$$$16,
"deco-sites/storefront/sections/Social/InstagramPosts.tsx": $$$$$$20,
"deco-sites/storefront/sections/Social/WhatsApp.tsx": $$$$$$21,
"deco-sites/storefront/sections/Theme/Theme.tsx": $$$$$$33,
},
"apps": {
"deco-sites/storefront/apps/decohub.ts": $$$$$$$$$$$1,
Expand Down
2 changes: 1 addition & 1 deletion static/tailwind.css
View file

Large diffs are not rendered by default.

0 comments on commit 74537a2

Please sign in to comment.