Publishing changes to shop (#1991)

Author: MagnusHafstad

frontend/src/components/pages/Janus/JanusSidebar.tsx

@@ -24,6 +24,7 @@ export const JanusSidebar: React.FC = () => {
           noLinkStyle
           label="Indøk kalender"
         />
+        <Tab component={Link} href="/janus/shop" value="/janus/shop" noLinkStyle label="Butikk" />
         <Tab component={Link} href="/janus" value="/janus" noLinkStyle label="Kontakt oss" />
       </Tabs>
     </Box>

frontend/src/components/pages/Janus/Shop/PurchaseButton.tsx

@@ -9,14 +9,14 @@ type Props = {
 export const PurchaseButton: React.FC<Props> = ({ productId }) => {
   return (
     <Button
-      disabled={true}
+      disabled={false}
       component={NextLinkComposed}
       to={{
         pathname: "/ecommerce/checkout",
         query: { productId, quantity: 1 },
       }}
       color="inherit"
-      size="large"
+      fullWidth
     >
       Kjøp nå!
     </Button>

frontend/src/components/pages/Janus/Shop/ShopItem.tsx

@@ -22,7 +22,7 @@ export const ShopItem: React.VFC<Props> = ({ product }) => {
             {product.name}
           </Typography>
           <Typography variant="body2" textAlign="left" color="text.secondary">
-            -, {product.price}
+            {product.price} kr
           </Typography>
         </CardContent>
       </CardActionArea>

frontend/src/components/pages/ecommerce/SalesTermsDialog.tsx

@@ -125,6 +125,10 @@ export const SalesTermsDialog: React.FC<Props> = ({ onClose, open }) => {
                   uten unødig opphold og senest 30 dager etter bestillingen fra kunden. Varen skal leveres hos kjøperen
                   med mindre annet er særskilt avtalt mellom partene.
                 </p>
+                <p>
+                  Ved kjøp fra indokntnu.no/janus/shop skal produkter hentes på Januskontoret med mindre annet er
+                  avtalt.
+                </p>
               </div>
             </section>
             <section id="chapter-7">

frontend/src/pages/janus/[id]/index.tsx

@@ -1,8 +1,7 @@
 import { useQuery } from "@apollo/client";
-import { Box, Stack } from "@mui/material";
+import { Alert, Box, Link, Stack, Typography } from "@mui/material";
 import { GetServerSideProps, InferGetServerSidePropsType } from "next";
 
-import { ProductInfo } from "@/components/pages/Janus/Shop/ProductInfo";
 import { PurchaseButton } from "@/components/pages/Janus/Shop/PurchaseButton";
 import { Template } from "@/components/pages/Janus/Template";
 import { ProductDocument, ProductFragment } from "@/generated/graphql";
@@ -17,22 +16,26 @@ const ProductPage: NextPageWithLayout<InferGetServerSidePropsType<typeof getServ
   return (
     <Template title={data?.product?.name?.toString() ?? ""} description="">
       <Stack spacing={2}>
-        <Box
-          sx={{
-            width: 750,
-            height: 250,
-            borderRadius: 1,
-            bgcolor: "primary.main",
-          }}
-        >
-          {/*<Image src={cabin} style={{ objectFit: "contain", width: "100%", height: "100%" }} alt={""} />*/}
-        </Box>
+        <Alert variant="filled" severity="info">
+          Produktet hentes på Januskontoret. Ved spørsmål kontakt{" "}
+          <Link href="mailto:web@janus.org.ntnu.no">web@janus.org.ntnu.no</Link>
+        </Alert>
+
+        {/*<Image src={cabin} style={{ objectFit: "contain", width: "100%", height: "100%" }} alt={""} />*/}
         <Stack direction={{ xs: "column", sm: "row" }} spacing={{ xs: 12, sm: 2, md: 8 }}>
           <Box style={{ width: "75%" }}>{data?.product?.description}</Box>
-          <ProductInfo price={0} sizes={["S", "M", "L"]} types={["Blue", "Red", "Gray"]} />
+          {/* <ProductInfo price={0} sizes={["S", "M", "L"]} types={["Blue", "Red", "Gray"]} /> */}
+          <Box style={{ width: "25%", borderRadius: "3px" }}>
+            {" "}
+            <Typography variant="h6" textAlign="left" padding={1}>
+              Pris: {data?.product?.price} kr
+            </Typography>{" "}
+            <Box color="white" bgcolor="primary.main" borderRadius={"3px"}>
+              <PurchaseButton productId={data?.product?.id ?? ""} />
+            </Box>
+          </Box>
         </Stack>
       </Stack>
-      <PurchaseButton productId={data?.product?.id ?? ""} />
     </Template>
   );
 };