Merge pull request #91 from eqlabs/fixes

Clearing some issues

components/Accounts.tsx

@@ -36,13 +36,11 @@ const AccountDialog = ({
 }) => {
   const snap = useSnapshot(state);
   const [showSecret, setShowSecret] = useState(false);
-  const activeAccount = snap.accounts.find(
-    (account) => account.address === activeAccountAddress
-  );
+  const activeAccount = snap.accounts.find(account => account.address === activeAccountAddress);
   return (
     <Dialog
       open={Boolean(activeAccountAddress)}
-      onOpenChange={(open) => {
+      onOpenChange={open => {
         setShowSecret(false);
         !open && setActiveAccountAddress(null);
       }}
@@ -137,7 +135,7 @@ const AccountDialog = ({
                     }}
                     ghost
                     size="xs"
-                    onClick={() => setShowSecret((curr) => !curr)}
+                    onClick={() => setShowSecret(curr => !curr)}
                   >
                     {showSecret ? "Hide" : "Show"}
                   </Button>
@@ -201,15 +199,7 @@ const AccountDialog = ({
                     fontFamily: "$monospace",
                   }}
                 >
-                  {activeAccount && activeAccount?.hooks?.length > 0
-                    ? activeAccount?.hooks
-                        .map((i) => {
-                          return `${i?.substring(0, 6)}...${i?.substring(
-                            i.length - 4
-                          )}`;
-                        })
-                        .join(", ")
-                    : "–"}
+                  {activeAccount && activeAccount.hooks.length}
                 </Text>
               </Flex>
             </Flex>
@@ -231,15 +221,13 @@ interface AccountProps {
   showHookStats?: boolean;
 }
 
-const Accounts: FC<AccountProps> = (props) => {
+const Accounts: FC<AccountProps> = props => {
   const snap = useSnapshot(state);
-  const [activeAccountAddress, setActiveAccountAddress] = useState<
-    string | null
-  >(null);
+  const [activeAccountAddress, setActiveAccountAddress] = useState<string | null>(null);
   useEffect(() => {
     const fetchAccInfo = async () => {
       if (snap.clientStatus === "online") {
-        const requests = snap.accounts.map((acc) =>
+        const requests = snap.accounts.map(acc =>
           snap.client?.send({
             id: acc.address,
             command: "account_info",
@@ -251,15 +239,13 @@ const Accounts: FC<AccountProps> = (props) => {
           const address = res?.account_data?.Account as string;
           const balance = res?.account_data?.Balance as string;
           const sequence = res?.account_data?.Sequence as number;
-          const accountToUpdate = state.accounts.find(
-            (acc) => acc.address === address
-          );
+          const accountToUpdate = state.accounts.find(acc => acc.address === address);
           if (accountToUpdate) {
             accountToUpdate.xrp = balance;
             accountToUpdate.sequence = sequence;
           }
         });
-        const objectRequests = snap.accounts.map((acc) => {
+        const objectRequests = snap.accounts.map(acc => {
           return snap.client?.send({
             id: `${acc.address}-hooks`,
             command: "account_objects",
@@ -269,9 +255,7 @@ const Accounts: FC<AccountProps> = (props) => {
         const objectResponses = await Promise.all(objectRequests);
         objectResponses.forEach((res: any) => {
           const address = res?.account as string;
-          const accountToUpdate = state.accounts.find(
-            (acc) => acc.address === address
-          );
+          const accountToUpdate = state.accounts.find(acc => acc.address === address);
           if (accountToUpdate) {
             accountToUpdate.hooks = res.account_objects
               .filter((ac: any) => ac?.LedgerEntryType === "Hook")
@@ -353,7 +337,7 @@ const Accounts: FC<AccountProps> = (props) => {
             overflowY: "auto",
           }}
         >
-          {snap.accounts.map((account) => (
+          {snap.accounts.map(account => (
             <Flex
               column
               key={account.address + account.name}
@@ -406,11 +390,10 @@ const Accounts: FC<AccountProps> = (props) => {
                     isLoading={account.isLoading}
                     disabled={
                       account.isLoading ||
-                      !snap.files.filter((file) => file.compiledWatContent)
-                        .length
+                      !snap.files.filter(file => file.compiledWatContent).length
                     }
                     variant="secondary"
-                    onClick={(e) => {
+                    onClick={e => {
                       e.stopPropagation();
                       deployHook(account);
                     }}
@@ -421,7 +404,7 @@ const Accounts: FC<AccountProps> = (props) => {
               </Flex>
               {props.showHookStats && (
                 <Text muted small css={{ mt: "$2" }}>
-                  X hooks installed
+                  {account.hooks.length} hook{account.hooks.length === 1 ? "" : "s"} installed
                 </Text>
               )}
             </Flex>
@@ -453,7 +436,7 @@ const ImportAccountDialog = () => {
             name="secret"
             type="password"
             value={value}
-            onChange={(e) => setValue(e.target.value)}
+            onChange={e => setValue(e.target.value)}
           />
         </DialogDescription>
 

components/EditorNavigation.tsx

@@ -90,9 +90,16 @@ const EditorNavigation = ({ showWat }: { showWat?: boolean }) => {
 
   const validateFilename = useCallback(
     (filename: string): { error: string | null } => {
-      if (snap.files.find((file) => file.name === filename)) {
+      // check if filename already exists
+      if (snap.files.find(file => file.name === filename)) {
         return { error: "Filename already exists." };
       }
+
+      // check for illegal characters
+      const ILLEGAL_REGEX = /[/]/gi;
+      if (filename.match(ILLEGAL_REGEX)) {
+        return { error: "Filename contains illegal characters" };
+      }
       // More checks in future
       return { error: null };
     },

components/Navigation.tsx

@@ -279,28 +279,18 @@ const Navigation = () => {
                       >
                         <Heading>Starter</Heading>
                         <Text>
-                          Just an empty starter with essential imports
+                          Just a basic starter with essential imports
                         </Text>
                       </PanelBox>
                       <PanelBox
                         as="a"
-                        href={`/develop/${templateFileIds.starter}`}
+                        href={`/develop/${templateFileIds.firewall}`}
                       >
                         <Heading>Firewall</Heading>
                         <Text>
                           This Hook essentially checks a blacklist of accounts
                         </Text>
                       </PanelBox>
-                      <PanelBox
-                        as="a"
-                        href={`/develop/${templateFileIds.accept}`}
-                      >
-                        <Heading>Accept</Heading>
-                        <Text>
-                          This hook just accepts any transaction coming through
-                          it
-                        </Text>
-                      </PanelBox>
                       <PanelBox
                         as="a"
                         href={`/develop/${templateFileIds.notary}`}

state/actions/compileCode.ts

@@ -25,6 +25,7 @@ export const compileCode = async (activeId: number) => {
   }
   // Set loading state to true
   state.compiling = true;
+  state.logs = []
   try {
     const res = await fetch(process.env.NEXT_PUBLIC_COMPILE_API_ENDPOINT, {
       method: "POST",

state/constants/templates.ts

@@ -1,6 +1,5 @@
 export const templateFileIds = {
     'starter': '1d14e51e2e02dc0a508cb0733767a914', // TODO currently same as accept
-    'accept': '1d14e51e2e02dc0a508cb0733767a914',
     'firewall': 'bcd6d0c0fcbe52545ddb802481ff9d26',
     'notary': 'a789c75f591eeab7932fd702ed8cf9ea',
     'carbon': '43925143fa19735d8c6505c34d3a6a47',