Merge branch 'main' into dev/mel-gql-experiment

.env

@@ -5,8 +5,8 @@ VITE_TEIA_REPORT='https://lists.teia.art'
 
 VITE_LOGOS='https://raw.githubusercontent.com/teia-community/teia-logos/main/dist'
 
-# VITE_TEIA_GRAPHQL_API='https://teztok.teia.rocks/v1/graphql'
-VITE_TEIA_GRAPHQL_API='https://teia-api.teztok.com/v1/graphql'
+VITE_TEIA_GRAPHQL_API='https://teztok.teia.rocks/v1/graphql'
+# VITE_TEIA_GRAPHQL_API='https://teia-api.teztok.com/v1/graphql'
 VITE_TZKT_API='https://api.tzkt.io'
 
 VITE_TZPROFILES_GRAPHQL_API='https://indexer.tzprofiles.com/v1/graphql'

index.html

@@ -30,6 +30,8 @@
     />
     <link rel="shortcut icon" href="/icons/favicon.ico?v=1" />
     <link rel="preconnect" href="https://cache.teia.rocks" />
+    <link rel="preconnect" href="https://imgproxy.teia.rocks" />
+    <link rel="preconnect" href="https://lists.teia.art" />
     <link rel="preconnect" href="https://raw.githubusercontent.com" />
     <meta name="build-commit" content="<%=BUILD_COMMIT%>" />
     <meta name="msapplication-TileColor" content="#ffc40d" />

src/App.jsx

@@ -4,10 +4,11 @@ import { Loading as Preloading } from '@atoms/loading'
 import { AnimatePresence } from 'framer-motion'
 import { Debug } from '@atoms/debug'
 import { Header } from '@components/header'
+import useFool from '@hooks/use-fool'
 
 const App = () => {
   const { isLoading } = useSettings()
-
+  useFool()
   if (isLoading) {
     return <Preloading />
   }

src/atoms/layout/page/index.tsx

@@ -44,7 +44,7 @@ export const Page = ({
         variants={containerVariants}
         className={`${classes} ${className ? className : ''}`}
       >
-        <motion.div className={styles.content}>
+        <motion.div className={`${styles.content} no-fool`}>
           <>{children}</>
         </motion.div>
       </motion.main>

src/atoms/token-collection/index.tsx

@@ -26,7 +26,7 @@ import type { getSdkWithHooks } from 'gql'
 /** Single view, vertical feed */
 function SingleView({ tokens }: { tokens: Partial<ExtTokens>[] }) {
   return (
-    <div className={styles.single_view}>
+    <div className={`${styles.single_view} no-fool`}>
       {tokens.map((token) => (
         <FeedItem key={token.token_id} nft={token} />
       ))}
@@ -206,11 +206,11 @@ function TokenCollection({
   const limitedTokens = tokens.slice(0, limit)
 
   return (
-    <div className={styles.feed_container}>
+    <div className={`${styles.feed_container} no-fool`}>
       <FeedToolbar feeds_menu={feeds_menu} />
       <IconCache.Provider value={{}}>
         <InfiniteScroll
-          className={`${styles.infinite_scroll}`}
+          className={`${styles.infinite_scroll} no-fool`}
           loadMore={() => {
             setSearchParams(
               {

src/components/header/main_menu/MainMenu.tsx

@@ -28,8 +28,8 @@ export const MainMenu = () => {
 
   // TODO: Search doesn't really make sense anymore? Does it? (commented out for now)
   return (
-    <motion.div className={styles.menu} {...fadeIn()}>
-      <nav className={styles.content}>
+    <motion.div className={`${styles.menu}`} {...fadeIn()}>
+      <nav className={`${styles.content}`}>
         <div className={`${styles.menu_left}`}>
           {/* <MenuItem route="search" /> */}
           <MenuItem className={styles.menu_label} route="search" />

src/components/header/main_menu/index.module.scss

@@ -13,7 +13,6 @@
   flex-direction: column;
 
   container: main_menu / inline-size;
-  height: 100%;
   width: 100%;
   top: 0;
   left: 0;
@@ -22,7 +21,7 @@
   transition: var(--body-transition);
 
   z-index: 400;
-  height: 100%;
+  height: 100vh;
 
   .content {
     line-height: 3em;

src/components/listings/index.tsx

@@ -15,14 +15,9 @@ import type { Listings, Tokens } from 'gql'
 function ListingRow({
   nft,
   listing,
-  // restricted,
-  // proxyAddress,
   onCollectClick,
   reswapPrices,
   setReswapPrices,
-  // reswap,
-  // cancel,
-  // address,
   proxyAdminAddress,
   rowId,
 }: {
@@ -42,7 +37,6 @@ function ListingRow({
   rowId: string
 }) {
   const { walletBlockMap } = useSettings()
-  // const [show, closeModal] = useModalStore((st) => [st.show, st.close])
   const [address, proxyAddress] = useUserStore((st) => [
     st.address,
     st.proxyAddress,
@@ -56,8 +50,8 @@ function ListingRow({
 
   console.debug('isOwnSwap', isOwnSwap)
   const restricted = useMemo(() => {
-    return nft.restricted
-  }, [nft.restricted])
+    return nft.restricted || walletBlockMap?.get(listing.seller_address) === 1
+  }, [nft.restricted, walletBlockMap, listing.seller_address])
 
   if (!walletBlockMap) return null
 
@@ -72,9 +66,7 @@ function ListingRow({
       </div>
 
       <div className={styles.buttons}>
-        {(restricted || walletBlockMap.get(listing.seller_address) === 1) && (
-          <RestrictedLabel />
-        )}
+        {restricted && <RestrictedLabel />}
         <MarketplaceLabel listing={listing} />
         {!restricted &&
           walletBlockMap.get(listing.seller_address) !== 1 &&
@@ -89,6 +81,7 @@ function ListingRow({
           )}
 
         {isOwnSwap &&
+          !restricted &&
           (listing.type.startsWith('TEIA') ||
             listing.type.startsWith('HEN')) && (
             <>
@@ -128,19 +121,18 @@ function ListingRow({
               >
                 reswap
               </Button>
-
-              <Button
-                alt={'Click to cancel swap'}
-                shadow_box
-                onClick={() =>
-                  cancel(listing.contract_address, listing.swap_id)
-                }
-                className={styles.smol}
-              >
-                cancel
-              </Button>
             </>
           )}
+        {isOwnSwap && (
+          <Button
+            alt={'Click to cancel swap'}
+            shadow_box
+            onClick={() => cancel(listing.contract_address, listing.swap_id)}
+            className={styles.smol}
+          >
+            cancel
+          </Button>
+        )}
       </div>
     </div>
   )

src/components/responsive-masonry/index.tsx

@@ -32,7 +32,7 @@ export const ResponsiveMasonry = ({ children }) => {
     <Masonry
       // cellSpacing={150}
       breakpointCols={colums}
-      className={styles.grid}
+      className={`${styles.grid} no-fool`}
       columnClassName={styles.column}
     >
       {children}

src/constants.ts

@@ -166,6 +166,7 @@ export const THEMES: { [key: string]: string } = {
   aqua: 'Aqua',
   coffee: 'Coffee',
   midnight: 'Midnight',
+  grass: 'Grass',
   // noui: 'No UI (Expert Mode)',
 }
 

src/context/localSettingsStore.ts

@@ -24,6 +24,8 @@ export const rpc_nodes = [
 export type RPC_NODES = typeof rpc_nodes[number]
 
 interface LocalSettingsState {
+  tilted: boolean
+  setTilted: (tilted: boolean) => void
   viewMode: ViewMode
   nsfwFriendly: boolean
   photosensitiveFriendly: boolean
@@ -53,13 +55,15 @@ const defaultValues = {
   themeDark: 'dark' as Theme,
   themeLight: 'light' as Theme,
   rpcNode: rpc_nodes[0],
+  tilted: false,
 }
 
 export const useLocalSettings = create<LocalSettingsState>()(
   subscribeWithSelector(
     persist(
       (set, get) => ({
         ...defaultValues,
+        setTilted: (tilted) => set({ tilted }),
         toggleViewMode: () =>
           set((state) => ({
             viewMode: state.viewMode === 'single' ? 'masonry' : 'single',

src/hooks/use-fool.js

@@ -0,0 +1,30 @@
+import { useEffect } from 'react'
+import { useLocalSettings } from '@context/localSettingsStore'
+
+/**
+ * Hook for april's fool day, it randomly rotates the style of all elements
+ *
+ */
+
+export default function useFool(minRotation = -2, maxRotation = 2) {
+  const [foolAround] = useLocalSettings((t) => [t.tilted])
+  useEffect(() => {
+    let styleEl = document.getElementById('page-styles')
+    if (!styleEl) {
+      styleEl = document.createElement('style')
+      styleEl.setAttribute('id', 'page-styles')
+      document.head.appendChild(styleEl)
+    }
+
+    let stylesheet = ''
+    if (foolAround) {
+      let value = 0
+      while (Math.abs(value) < 0.3) {
+        value = Math.random() * (maxRotation - minRotation) + minRotation
+      }
+      stylesheet = `*:not(.no-fool):not([id^="beacon-alert-wrapper-"]):not(main):not(body):not(html):not(#root) { transition: transform 500ms; rotate:${value}deg; }`
+    }
+
+    styleEl.innerHTML = stylesheet
+  }, [foolAround, minRotation, maxRotation])
+}

src/lang/en/about.md

@@ -48,7 +48,7 @@ The Teia Marketplace Interface and marketplace contract are [code forks](https:/
 
 **Marketplace Contract Admin:** [KT1PKBTVmdxfgkFvSeNUQacYiEFsPBw16B4P](https://tzkt.io/KT1PKBTVmdxfgkFvSeNUQacYiEFsPBw16B4P/operations/) - [multisig contract](https://multisign.onrender.com/) developed and owned by the Teia Community
 
-The [marketplace fees](https://github.com/teia-community/teia-docs/wiki/Marketplace-Fees) are temporarily set to 0%.
+The [marketplace fees](https://github.com/teia-community/teia-docs/wiki/Marketplace-Fees) are set to 2.5%.
 
 ---
 

src/pages/collaborate/manage.tsx

@@ -134,7 +134,7 @@ export const CollabContractsOverview = ({ showAdminOnly = false }) => {
         <p>
           {loadingCollabs
             ? 'Looking for collabs...'
-            : 'You aren’t part of any collaborations at the moment'}
+            : 'You are not a manager of any collaborations at the moment'}
         </p>
       )} */}
     </Container>

src/pages/config/Settings.tsx

@@ -14,13 +14,17 @@ export const Settings = () => {
     setPhotosensitiveFriendly,
     rpcNode,
     setRpcNode,
+    tilted,
+    setTilted,
   ] = useLocalSettings((st) => [
     st.nsfwFriendly,
     st.setNsfwFriendly,
     st.photosensitiveFriendly,
     st.setPhotosensitiveFriendly,
     st.rpcNode,
     st.setRpcNode,
+    st.tilted,
+    st.setTilted,
   ])
 
   return (
@@ -54,6 +58,7 @@ export const Settings = () => {
             onCheck={setPhotosensitiveFriendly}
             label={'Allow Photosensitive on feeds'}
           />
+
           <Line />
           <ThemeSelection label={'Theme'} />
           <Line />
@@ -66,6 +71,14 @@ export const Settings = () => {
               setRpcNode(e.value)
             }}
           />
+          <Line />
+          <Checkbox
+            alt={`click to enable fool around (a throwback of the 2023 april fool)`}
+            checked={tilted}
+            onCheck={(c) => setTilted(c)}
+            className="no-fool"
+            label={'Fool Around'}
+          />
         </div>
       </div>
     </Page>

src/pages/objkt-display/tabs/History.tsx

@@ -144,9 +144,14 @@ export const History = () => {
             )
           }
           if (
-            ['TEIA_SWAP', 'HEN_SWAP', 'HEN_SWAP_V2', 'VERSUM_SWAP'].includes(
-              e.type
-            )
+            [
+              'OBJKT_ASK',
+              'OBJKT_ASK_V2',
+              'TEIA_SWAP',
+              'HEN_SWAP',
+              'HEN_SWAP_V2',
+              'VERSUM_SWAP',
+            ].includes(e.type)
           ) {
             return (
               <HistoryRow
@@ -173,17 +178,8 @@ export const History = () => {
           if (
             e.type === 'FA2_TRANSFER' &&
             e.to_address !== BURN_ADDRESS &&
-            !nft.events.some(
-              (ev) =>
-                (ev.implements === 'SALE' ||
-                  [
-                    'TEIA_SWAP',
-                    'HEN_SWAP',
-                    'HEN_SWAP_V2',
-                    'VERSUM_SWAP',
-                  ].includes(ev.type)) &&
-                e.ophash === ev.ophash
-            )
+            !e.from_address.startsWith('KT1') &&
+            !e.to_address.startsWith('KT1')
           ) {
             return (
               <HistoryRow

src/pages/objkt-display/tabs/Swap.tsx

@@ -168,9 +168,9 @@ export const Swap = () => {
           <Container>
             <div className={styles.container}>
               <p>
-                The Teia marketplace fee is temporarily set to 0%. Please
-                consider donating to teiaescrow.tez
-                (tz1Q7fCeswrECCZthfzx2joqkoTdyin8DDg8) for maintenance funding.
+                The Teia marketplace fee is set to 2.5%. Fees get directed to
+                the Teia DAO treasury multisig
+                (KT1J9FYz29RBQi1oGLw8uXyACrzXzV1dHuvb)
               </p>
             </div>
           </Container>

src/styles/main.scss

@@ -13,6 +13,7 @@ html {
   padding: 0;
   width: 100%;
   height: 100vh;
+  background-color: var(--background-color);
 }
 
 body {