feat: initial Pezkuwi Apps rebrand from polkadot-apps

Rebranded terminology: - Polkadot → Pezkuwi - Kusama → Dicle - Westend → Zagros - Rococo → PezkuwiChain - Substrate → Bizinikiwi - parachain → teyrchain Custom logos with Kurdistan brand colors (#e6007a → #86e62a): - bizinikiwi-hexagon.svg - sora-bizinikiwi.svg - hezscanner.svg - heztreasury.svg - pezkuwiscan.svg - pezkuwistats.svg - pezkuwiassembly.svg - pezkuwiholic.svg
2026-04-23 10:37:59 +00:00 · 2026-01-07 13:05:27 +03:00
commit d21bfb1320
5867 changed files with 329019 additions and 0 deletions
@@ -0,0 +1,114 @@
+// Copyright 2017-2025 @pezkuwi/apps authors & contributors
+// SPDX-License-Identifier: Apache-2.0
+
+import type { ItemRoute } from './types.js';
+
+import React from 'react';
+
+import { Badge, Icon, styled } from '@pezkuwi/react-components';
+import { useToggle } from '@pezkuwi/react-hooks';
+
+interface Props {
+  className?: string;
+  classNameText?: string;
+  isLink?: boolean;
+  isToplevel?: boolean;
+  route: ItemRoute;
+}
+
+const DUMMY_COUNTER = () => 0;
+
+function Item ({ className = '', classNameText, isLink, isToplevel, route: { Modal, href, icon, name, text, useCounter = DUMMY_COUNTER } }: Props): React.ReactElement<Props> {
+  const [isModalVisible, toggleModal] = useToggle();
+  const count = useCounter();
+
+  return (
+    <StyledLi className={`${className} ui--MenuItem ${count ? 'withCounter' : ''} ${isLink ? 'isLink' : ''} ${isToplevel ? 'topLevel highlight--color-contrast' : ''}`}>
+      <a
+        href={Modal ? undefined : (href || `#/${name}`)}
+        onClick={Modal ? toggleModal : undefined}
+        rel='noopener noreferrer'
+        target={href ? '_blank' : undefined}
+      >
+        <Icon icon={icon} />
+        <span className={classNameText}>{text}</span>
+        {!!count && (
+          <Badge
+            color='white'
+            info={count}
+          />
+        )}
+      </a>
+      {Modal && isModalVisible && (
+        <Modal onClose={toggleModal} />
+      )}
+    </StyledLi>
+  );
+}
+
+const StyledLi = styled.li`
+  cursor: pointer;
+  position: relative;
+  white-space: nowrap;
+
+  &.topLevel {
+    font-weight: var(--font-weight-normal);
+    line-height: 1.214rem;
+    border-radius: 0.15rem;
+
+    a {
+      padding: 0.857rem 0.857em 0.857rem 1rem;
+      line-height: 1.214rem;
+      border-radius: 0.25rem;
+    }
+
+    &.isActive.highlight--color-contrast {
+      font-weight: var(--font-weight-normal);
+      color: var(--color-text);
+
+      a {
+        background-color: var(--bg-tabs);
+      }
+    }
+
+    &.isActive {
+      border-radius: 0.15rem 0.15rem 0 0;
+
+      a {
+        padding: 0.857rem 1.429rem 0.857rem;
+        cursor: default;
+      }
+
+      &&.withCounter a {
+        padding-right: 3.2rem;
+      }
+    }
+
+    .ui--Badge {
+      top: 0.7rem;
+    }
+  }
+
+  &&.withCounter a {
+    padding-right: 3.2rem;
+  }
+
+  a {
+    color: inherit !important;
+    display: block;
+    padding: 0.5rem 1.15rem 0.57rem;
+    text-decoration: none;
+    line-height: 1.5rem;
+  }
+
+  .ui--Badge {
+    position: absolute;
+    right: 0.5rem;
+  }
+
+  .ui--Icon {
+    margin-right: 0.5rem;
+  }
+`;
+
+export default React.memo(Item);